从下拉列表中的特定列搜索数据表

Question

我有一个包含四列的表，如下所示：

name | description | profile | action 

我想搜索/过滤单列中的记录，即name。我尝试了这个，但它会搜索所有列：

var oTable = $('#carrier-profile-listing').DataTable({
             "pagingType": "full_numbers",
             "serverSide": true,
             "processing": false,
             "paging": true,
             "searching": { "regex": true },
             "pageLength": 50,
             "lengthMenu": [
                 [15, 20, 50, -1], [15, 20, 50, "All"] // change per page values here
             ],
             "initComplete": function() {
                 var $searchInput = $('div.dataTables_filter input');
                 $searchInput.unbind();
                 $searchInput.bind('keyup', function(e) {
                     if(e.keyCode == 13) {
                         oTable.search( this.value ).draw();
                     }
                 });
             },
             "ajax": {
                 "url": "/carriers_profile_list",
                 data: {"_token": "{{ csrf_token() }}"},
                 "type": "POST",
                 "dataType": 'json',
                 "async": true,
                 beforeSend: function () {
                     showAjaxLoader();
                 },
                 complete: function () {
                     hideAjaxLoader();
                 },
                 error: function (jqXHR, timeout, message) {
                 }
             },
             "columnDefs": [
                 { "width": "20%", "targets": 0 },
                 { "width": "20%", "targets": 1 },
                 { "width": "30%", "targets": 2 },
                 { "width": "30%", "targets": 3 }

             ],
             "columns": [
                 {
                     "data"      : "name",
                     "name"      : "name",
                     "orderable" : true
                 },
                 {
                     "data"      : "description",
                     "name"      : "description",
                     "orderable" : true
                 },
                 {
                     "data"      : "profile",
                     "name"      : "profile",
                     "orderable" : false
                 },
                 { "mRender": function ( data, type, row ) {
                    return '<a href="/commission-process/'+row['id']+'/edit">Edit</a> -- <a class="donot_check_form_data" href="/commission-process/download_mapped_sheet/'+row['id']+'">Download Sheet</a>';}
                 }
             ],

             fixedHeader: {
                header: true,
                 headerOffset: fixedHeaderOffset
            },
             "language": {
                 "lengthMenu": "Display _MENU_ records per page",
                 "zeroRecords": "No records found",
                 "infoEmpty": "No records available",
                 "infoFiltered": "(filtered from _MAX_ total records)"
             }
         });

$("#carrier-drpdwn").on("change", "select[name='carrier_id']", function() {
  var textSelected =   $("#carrier-drpdwn option:selected").text();
  oTable.search(textSelected).draw(); 
});

任何帮助将不胜感激。

Answer 1

为此，您可以在DataTable中的各个search()对象上调用column。例如，如果要搜索name列，即索引0，则可以执行以下操作：

var oTable = $('#carrier-profile-listing').DataTable();

$('#carrier-drpdwn').on('change', 'select[name="carrier_id"]', function() {
  var textSelected = $('#carrier-drpdwn option:selected').text();
  oTable.columns(0).search(textSelected).draw(); // note columns(0) here
});

Answer 2

如果您正在使用Datatables jQuery插件您可以在其网站上找到许多非常有用的帮助。例如，https://datatables.net/examples/api/multi_filter.html示例将帮助您处理您的请求。