独立列过滤不保存下拉列表状态jQuery

Question

在页面刷新时，状态保持不变。

在页面刷新时，应显示下拉选定值，但不是在下拉列表中选择所有值。

if ($("#tblcontracts") !== null) { 

    var tableContract = $('#tblcontracts').DataTable({ 
     "stateSave": true, 
     "order": [[0, "desc"]], 
     "language": { 
      "searchPlaceholder": "Search", 
      "lengthMenu": "Showing _MENU_ contracts", 
      "zeroRecords": "Sorry no contract(s) found", 
      "info": "Showing _START_ of _END_ of _TOTAL_ contracts", 
      "infoEmpty": "No contract(s) found", 
      "infoFiltered": "(filtered from _MAX_ total contracts)" 

     }, 
     initComplete: function() { 
      var ColumnNo = 0; 
      this.api().columns().every(function() { 

       if (ColumnNo == 0) { 
        var column = this; 
        var select = $('<select><option value="">---ALL---</option></select>') 
         .appendTo($(column.footer()).empty()) 
         .on('change', function() { 
          var val = $.fn.dataTable.util.escapeRegex(
           $(this).val() 
          ); 

          column 
           .search(val ? '^' + val + '$' : '', true, false) 
           .draw(); 
         }); 

        column.data().unique().sort().each(function (d, j) { 
         select.append('<option value="' + d + '">' + d + '</option>') 
        }); 
       } 

Answer 1

加载表格后，可以从表格状态中读取列搜索数据，然后从下拉列表中选择适当的值。

在你initComplete回调，您可以将这样的标记，您当前的过滤器相匹配的selected选项：

var filter = tableContract.state().columns[0].search.search; 

column.data().unique().sort().each(function (d, j) { 
    var selected = (d === filter) ? 'selected' : ''; 
    select.append('<option value="' + d + '" ' + selected + '>'+d+'</option>';) 
}); 

如果你有saveState设置为true，tableContract.state().columns[0].search.search应包含栏搜索值0.