jQuery DataTable – 搜索一列下拉列表
我有一个简单的jQuery数据表，包含4列，其中一列是下拉列表。
Vendor Location Currency Vendor Type Vendor Vendor Location Currency Vendor Type Vendor New York American Steel Vendor Name 1 Vendor Name 2 Vendor Name 3 Vendor Name 4 Vendor Name 5 Montreal Canadian Plastic Vendor Name 1 Vendor Name 2 Vendor Name 3 Vendor Name 4 Vendor Name 5 Toronto Canadian Logistics Vendor Name 1 Vendor Name 2 Vendor Name 3 Vendor Name 4 Vendor Name 5 Los Angeles American Lumber Vendor Name 1 Vendor Name 2 Vendor Name 3 Vendor Name 4 Vendor Name 5 Seattle American Services Vendor Name 1 Vendor Name 2 Vendor Name 3 Vendor Name 4 Vendor Name 5
#vendorListing_wrapper { width: 800px; } #vendorListing_filter { display: none; } .odd { background: #dddddd !important; } .even { background: #ffffff; } var vendorTable = ""; $(function() { $('#vendorListing tfoot th.searchBox').each(function() { var title = $(this).text(); $(this).html(''); }); vendorTable = $("#vendorListing").DataTable(); vendorTable.columns().every(function() { var that = this; $('input', this.footer()).on('keyup change', function() { if (that.search() !== this.value) { that .search(this.value) .draw(); } }); }); }); 从上面的代码中可以看出，您可以单独搜索每个列。 我遇到的问题是仅使用下拉列表搜索列中的选定选项。 例如，当我搜索名称1时，我应该只获取纽约行，但是我得到所有行，因为名称1仍然存在于所有下拉列表中，它只是未被选中。
任何人都知道如何过滤搜索function，以便只显示所选项目？
https://jsfiddle.net/wbfsLx2x/2/
谢谢！
检查这个jsfiddle 。 您需要做的是覆盖默认搜索。
$.fn.dataTable.ext.search.push( function (settings, data, dataIndex, rowData, counter) { var search_VendorLocationText = $('#search_VendorLocation').val(); var search_CurrencyText = $('#search_Currency').val(); var search_VendorTypeText = $('#search_VendorType').val(); var search_VendorText = $('#search_Vendor').val(); var textFound = true; if(search_VendorLocationText.length){ var pattern = new RegExp(search_VendorLocationText, 'i'); if(pattern.test(data[0])){ textFound = true; }else{ textFound = false; } } if(search_CurrencyText.length){ var pattern = new RegExp(search_CurrencyText, 'i'); if(pattern.test(data[1])){ textFound = true; }else{ textFound = false; } } if(search_VendorTypeText.length){ var pattern = new RegExp(search_VendorTypeText, 'i'); if(pattern.test(data[2])){ textFound = true; }else{ textFound = false; } } if (search_VendorText.length) { var pattern = new RegExp(search_VendorText, 'i'); if (pattern.test($(rowData[3]).children("option:selected").html())) { textFound = true; }else{ textFound = false; } } return textFound; } );
希望这是你需要的。
问候，呀