DataTableで検索している個々の列が機能していません

Question

テーブルが正しくレンダリングされており、固定ヘッダーとフッターとサーバー側処理を使用しています。私はhereが見つかったことに基づいて個別の列の検索（テキスト入力）を追加しました。しかし、いずれのフィルタボックスに入力しても、ID（最初の列）のみを検索し、存在する列は検索しません。ここで

は私がDatatTableを初期化する方法は次のとおりです。

$(document).ready(function() { 

    // Setup - add a text input to each footer cell 
    $('#DataTable tfoot th').each(function() { 
     var title = $(this).text(); 
     $(this).html('<input type="text" placeholder="Search ' + title + '" />'); 
    }); 

    var table = $('#DataTable').DataTable({ 
      "lengthMenu" : [[25, 50, 75, 100, 150], [25, 50, 75, 100, 150]], 
      "dom" : '<"top"Bilp<"clear">>rt<"bottom"ip<"clear">>', 
      "buttons" : [{ 
        extend : 'collection', 
        text : 'Selection', 
        buttons : ['selectAll', 'selectNone'] 
       }, { 
        extend : 'collection', 
        text : 'Export', 
        buttons : ['excel', 'csv', 'pdf'] 
       } 
      ], 
      "fixedHeader" : { 
       header : true, 
       footer : true 
      }, 
      "select" : true, 
      "processing" : true, 
      "serverSide" : true, 
      "ajax" : { 
       "url" : "./ServerSide.php", 
       "type": "POST" 
      }, 
    initComplete: function() { 
     var api = this.api(); 

     // Apply the search 
     api.columns().every(function() { 
     var that = this; 

     $('input', this.footer()).on('keyup change', function() { 
      if (that.search() !== this.value) { 
      that 
       .search(this.value) 
       .draw(); 
      } 
     }); 
     }); 
    } 
    }); 
}); 

私はこれと間違って何かをやっていますか？

Answer 1

コードが不足しているため、コードをデバッグすることはほとんど不可能です。あなたのためにそれをデバッグする代わりに、私はあなたが何をするかを教えてくれるでしょう。問題は、何ができるかを理解する

：

1）あなたのJavaScriptは、あなたがそれをやるべきだと思う何をしていません。 （私はそれが問題だと思います）

2）あなたのサーバー側のコード（PHP）は、あなたが考えるべきことをしていません。本当にあなたのコードが間違って何が起こっているかを検証する

：

1）あなたは、Chromeでインスペクタを開き、あなたのコード内の任意のJavaScriptエラーを持っていないことを確認しました。エラーが発生した場合は、まずすべてのエラーを削除するようにコードを編集します。それでも問題が解決しない場合は、手順2に進みます。

2）DataTable AJAXリクエストから取得したファイルを出力します。 、そして、

file_put_contents("request.log", var_export($_REQUEST)); 

をファイルを開き、検索ボックスに入力したテキストを検索：あなたはあなたのファイルの先頭にこれを追加することにより、ServerSide.phpを変更することができます。

3）成功してステップ2を通過した場合は、サーバー側の処理から何が得られるかを確認する必要があります。

echo json_encode(
    SSP::simple($_GET, $sql_details, $table, $primaryKey, $columns) 
); 

へ：単純にファイルの末尾を変更

$jsonData = json_encode(SSP::simple($_GET, $sql_details, $table, $primaryKey, $columns)); 
file_put_contents("output.log", $jsonData); 
echo $jsonData; 

これは、ログファイルにJSON出力を追加します。それを開き、そこに表示されている結果があなたの期待しているものであるかどうかを確認します。

4）結果を確認する時間です！検索フィルターの値が表示されない場合は、JavaScriptに問題があります。検索フィルターを受け取ったにもかかわらず、間違った出力を返すと、サーバー側のPHPコードに問題があります。

私はそれが助けて欲しい！

Chromeのインスペクタで[ネットワーク]タブを使用しても同じことができます。

更新： JavaScriptコードでは、サーバーにデータを送信するために「POST」を使用しています。私はまた、Webページから送信されたものを読むために "GET"（$_GET）を使用しているサーバーサイドコードの最後の行にhereがあることも確認します。このコードを使用している場合は、PHPで$_POSTを使用してパラメータを正しく取得する必要があることに注意してください。