数据表列筛选插件与选择标签(dataTables Column Filtering Plugin w

我使用的数据表v1.92与列过滤插件V1.5.0一起。

问题

我需要创建单独的列筛选，其标记将drodowns

<option value="1">Abc</option>
<option value="2">Def</option>
<option value="3">Ghi</option>

这是因为，来自数据库的值是1, 2, or 3 。 显示给用户的标签或者是Abc, Def, or Ghi

使用列过滤插件，我能够创建使用列下拉

.columnFilter({
    aoColumns: [ type : 'select', values:['1', '2', '3']
               ]
         });

问题是，那个下拉的标记原来是

<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>

因此，用户被示1, 2, 3为下拉标签取代Abc, Def, Ghi

我的尝试

我试图硬编码在下拉<tfoot> DataTable的部分，但随后

.columnFilter({
    aoColumns: [ type : 'select', values:['1', '2', '3']
                   ]
             });

覆盖硬编码的下拉列表。 我甚至尝试传递null作为参数aoColumns但它只是删除硬编码的下拉式选单，没有工作过。

那么，有没有我可以创建在该下拉的方式value属性将举行一个数值，而之间的标签<option>和</option>将文本？

Answer 1:

我不知道你是否已经解决了这个还没有，但是看的DataTable的插件网站，我不能看到周围做一个办法你问什么。

但是，对于一个变通方法，您可以创建<select>前手，然后使用菜单fnFilter回调更新与特定淡水河谷的列。

如

<select>
   <option value="1">ABC</option>
   <option value="2">DEF</option>
   <option value="3">GHI</option>
</select>

-

$('select').change(function(){
    yourTable.fnFilter($(this).val(),colNum);
    // With colNum being the targeted column.  
});

上述然后将由您的值筛选表<option>标记，例如1 。 但是，如果你正在寻找由ABC过滤封闭在<option>标签。

$('select').change(function(){
   yourTable.fnFilter($('select option:selected').text(),colNum); 
});

希望这是一些帮助。

Answer 2:

如果你正在使用jquery.dataTables.columnFilter.js ，那么下面的方法会为你工作：

而不是书写的：

type : 'select', values:['1', '2', '3']

这样写：

"type": "select", values: [{ label: "ABC", value: "1" }, { label: "DEF", value: "2" }]

文章来源: dataTables Column Filtering Plugin with Select Tags