随机调用两次的数据表导致空表

Question

我使用Datatable显示包含5个标签的表格。调试一段时间后，我注意到每次调用数据库都完成了两次。第一个调用返回一个空的JSON，第二个调用返回正确的数据。这会导致在第二组调用结束之前第二组调用结束时不会填充表。

这是我使用的代码：

$('a[data-toggle="tab"]').on( 'shown.bs.tab', function (e) {
    $.fn.dataTable.tables( {visible: true, api: true} ).columns.adjust();
} );
  var table = $('table.table').DataTable( {
      "processing": true,
      "serverSide": true,     
      "ajax": {
          "dataSrc": "Data",
          "url": "my_controller/getDataTable",
          "data": { string: $("input.form-control").val() },// gets the value from the hidden search field and check the db with this string (i.e "job2")
          "type": "POST"
      },
      "columns": [
          { "data": "name" },
          { "data": "eff" },
          { "data": "sal" },
          { "data": "id",       // The data to use in the link
               "render": function(data,type,row,meta) {
                 var a = "<a href='some_url'><button>hire</button>";
                 return a;
               }
           }
        ]
        });
        // Apply a search to the other tables to filter the list automatically
        $('#myTable1').DataTable().search( 'job1' ).draw();
        $('#myTable2').DataTable().search( 'job2' ).draw();
        $('#myTable3').DataTable().search( 'job3' ).draw();
        $('#myTable4').DataTable().search( 'job4' ).draw();
        $('#myTable5').DataTable().search( 'job5' ).draw();

以下是Firebug的快照：

我不明白我的代码的哪一部分导致了问题。

如果我最后删除了.draw，那么只有空的回复......

Answer 1

您首次使用.DataTable()时会对每个表格进行实例化，并且在您使用.DataTable().search( 'job1' ).draw();

时再次执行此操作

您可以使用column().search()过滤表格中的单个列。 Source

$('#myTable1').columns(ColumnIndex).search('job1').draw();

<强>更新

var table1 = initializeTable($("#myTable1"));
var table2 = initializeTable($("#myTable2"));

function initializeTable(tbl){
    return tbl.DataTable({
        ...setup table...
    });
}

table1.columns(ColumnIndex).search('job1').draw();
table2.columns(ColumnIndex).search('job2').draw();