Question

的数据表

我的场景是我根据某些事件更改了表的内容。

<table cellpadding="0" cellspacing="0" border="0" id="dataTable0">
   <thead>
      <tr style="width: 100%;">                         
         <th>Campaign Name</th>
         <th>Schedule</th>
         <th>List</th>  
      </tr>
    </thead>
  <tbody id="CampaignTableViewBody"></tbody>
</table>

适用于DATATABLE的初始化脚本

$(document).ready(function() {
   oTable = $('#dataTable0').dataTable({
    "bJQueryUI": true,
    "bScrollCollapse": false,
    "sScrollY": "200px",
    "bAutoWidth": true,
    "bPaginate": true,
    "sPaginationType": "full_numbers", //full_numbers,two_button
    "bStateSave": false,
    "bInfo": true,
    "bFilter": true,
    "iDisplayLength": 25,
    "bLengthChange": true,
    "aLengthMenu": [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]]
  });
});

动态填充数据

$("#CampaignTableViewBody").empty();
$("#CampaignTableViewBody").append(
     '<tr>'+ 
        '<td>'+obj.name+'</td>'+
        '<td>'+obj.startTime+'</td>'+
        '<td>'+obj.listTemplateUsed+'</td>'+                            
      '</tr>');

我有一个下拉菜单说选择ClassRoom：我正在动态填写属于选定课堂的表格中的所有学生数据。

说教室“A”被选中，然后我会在表格中显示“Rahul”，“Jason”

现在如果用户更改了教室，那么我将使用$("#CampaignTableViewBody").empty();删除表中的所有数据，并在表中迭代新数据。

说教室“B”被选中然后我删除表格中的所有数据，然后我将在表格中显示“Mayur”，“John”。

但问题在于，当我在Word“Rahul”提供的数据表中的搜索框中搜索时，它显示了不应该是大小写的行，因为类“B”被选中而类B没有Rahul。

填充表中的数据一切顺利，我只能看到2行，即“Mayur”和“John”，只有问题在于数据表搜索，这使得旧数据的结果不再存在。

任何想法如何克服它。

Answer 1

你需要'销毁'以前的DataTable

$("#dataTable0").dataTable().fnDestroy(); // Destroy the previous table
$("#CampaignTableViewBody").empty(); // Empty (remove any DOM elements)


$("#CampaignTableViewBody").append( 
     '<tr>'+ 
        '<td>'+obj.name+'</td>'+
        '<td>'+obj.startTime+'</td>'+
        '<td>'+obj.listTemplateUsed+'</td>'+                            
      '</tr>'); // Append the new information 

$("#dataTable0").dataTable(settings); // Recreate the datatable

希望这适合你！这里有更多Api功能：http://datatables.net/api

祝好运实施。

jquery数据表搜索显示已删除的数据

1 个答案: