bootstrap-table-filter-control扩展在bootstrap-table中不起作用

我使用bootstrap-table并希望使用table-filter-control扩展。 在此示例中，您可以看到如何使用此扩展。 当我想将此扩展名用于更多列时，它不起作用。 在我的示例中，filter仅适用于一列。

的jsfiddle

HTML

 
 
 
 
Customer Name
 
Location Type
 
Location
 
 
 
 
 
 
Cap Corp
 
Main
 
Norwalk CT 06851
 
 
 
 
Cap Corp
 
Other
 
Norwalk CT 06851
 
 
 
 
Tel
 
Main
 
Slough SL1 4DX
 
 
 
 
Tel
 
Other
 
London W1B 5HQ
 
 
  

Answer 1

数据库应该没有空格，试着改变

 data-field="Customer Name" 

至

 data-field="CustomerName" 

我更新了你的jsfiddle和filter-control工作。

http://jsfiddle.net/5h595r6g/9/

但是，如我在本文中所描述的那样，将filter选项更新为可用值会很棒：

bootstrap table filter-control – 如何从select选项中取消设置不必要的值

Answer 2

我实际上在标题中放了select2框，然后使用paramsfunction将代码传递给服务器。 我做了一个更好的解决方案。 我的代码不适合我，但如果你对它感兴趣，我可以在周一传递样本。

编辑添加示例。

基本表

初始化select2

  $('#90day').on('post-header.bs.table', function () { $('#findfield').select2({ width: '100%', placeholder: 'Field', allowClear: true, SingleSelection: true, ajax: { url: 'selectfield90day.php?active=y', dataType: 'json', //delay: 250, data: function (params) { $('#findfield').empty(); var d = new Date(); var n = d.getTime(); return { q: params.term, n: n }; }, processResults: function (data) { return { results: data }; } } }); $('#findwellname').select2({ width: '100%', placeholder: 'Name', allowClear: true, ajax: { url: 'selectwellname90day.php?active=y', dataType: 'json', delay: 250, data: function (params) { $('#findwellname').empty(); var d = new Date(); var n = d.getTime(); return { q: params.term, field: $('#findfield').text(), pad: $('#findpad').text(), n: n }; }, processResults: function (data) { return { results: data }; } } }); //refresh on any select2 change $('.gosearch').on('select2:close', function(){ $('#90day').bootstrapTable('refresh'); }); }); 

最后表初始化

 $('#90day').bootstrapTable({ url: ..., columns:[ ... ], queryParams: function(params){ params['field']=$('#findfield').text(); params['well_name']=$('#findwellname').text(); return params; } });