2017-10-11 99 views
1

我需要在数据库表中添加一个下拉筛选器选项,该选项根据所选值显示表中的记录。我检查了DataTable的最新文档,并尝试以下内容:在数据表插件中添加下拉筛选器选项

$('#checkin-checkout-record-table').dataTable({ 
    /* "dom": '<"toolbar">C<"clear">lfrtip<"clear">T', 
    tableTools: { 
     "sSwfPath": app.baseurl("/gbdportal/assets/js/libs/TableTools-2.2.4/swf/copy_csv_xls_pdf.swf"), 
     "aButtons": [{ 
      "sExtends": "xls", 
      "oSelectorOpts": { filter: 'applied', order: 'current' } 

     }] 
    },*/ 
    "bPaginate": true, 
    "bLengthChange": true, 
    "bFilter": true, 
    "bSort": true, 
    "bInfo": true, 
    // "order": [[0, 'asc'], [4, 'asc']], 
    "aLengthMenu": [50, 100], 
    "bAutoWidth": false, 

    initComplete: function() { 
     this.api().columns().every(function() { 
      var column = this; 
      var select = $('<select><option value=""></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>') 
      }); 
     }); 
    } 
}); 

但是不显示过滤器下拉列表。我认为这可能是由于版本不兼容。我正在使用1.10.0-dev版本。

+0

也许你可以添加一个jsFiddle,这样我们可以帮助你更好 – MaVRoSCy

回答

1

你的错误是,你要使用的数据表1.10.0版本与legacy Databales

这可以从你的数据表初始化代码中可以看出:

$('#checkin-checkout-record-table').dataTable({.... 

正确使用1.10.0+哪里将(介意CAPS):

$('#checkin-checkout-record-table').DataTable({ 

您可以使用传统的数据表或数据表新做你想要什么,但总是与匹配的代码哟你的首选版本。