是否可以按数据属性筛选jQuery数据表？

我想知道是否有可能通过jQuery数据表的一个数据属性而不是单元格的内容来过滤它。要对列动态应用筛选器，可以使用以下调用：

$table.fnFilter('^(Some value)$', columnIndex, true, false);

默认情况下，这将使用正则表达式过滤单元格的确切内容。但是，假设我的单元格是这样构造的：

<td data-label="Active"><i class="fa fa-check fa-lg"></i></td>

或

Active
一些文本

---

我希望DataTable能够根据属性

数据标签的确切内容而不是单元格内容进行筛选。在表init上设置列时是否需要定义搜索类型？或者有没有办法定义按属性而不是按内容过滤？
如果要按代码触发过滤，请创建自定义过滤器：

$.fn.dataTable.ext.search.push(
功能（设置、数据、数据索引）{
var dataLabel=表
.row（dataIndex）//获取要计算的行
.nodes（）//提取HTML-node（）不支持$
.to$（）//作为jQuery对象获取
.find（'td[数据标签]）//查找带有数据标签的列
.data（'label'）；//获取数据标签的值
返回dataLabel==“活动”；
}     
);

演示->

如果您只想在用户在搜索框中键入时使用
数据标签
作为筛选目标，则可以将
数据标签
重命名为
数据搜索
或
数据过滤器
：



dataTables调用它。
您还可以通过将每个表的自定义回调存储在initComplete回调中的“设置”中，然后在公共搜索处理程序下从实例的“设置”对象中调用来定义它。代码如下：


$（函数（）{
//通用/统一插件（适用于所有数据表）
$.fn.DataTable.ext.search.push(
函数（设置、列输出、数据索引、数据、输出索引）{
//this=ext.search数组（所有自定义搜索函数（包括此函数）
如果（设置。\u myFilter）{
返回设置。\u myFilter.call（设置{
数据：数据，
dataIndex:dataIndex，
outputinex:outputinex，
columnsOutput:columnsOutput，
设置：设置
});
}否则{
返回true；
}
}
);
//精确数据表初始化
var dTable=$（“#示例”）.DataTable({
//一些样本数据
数据：[{name:“John”}，{name:“Jack”}，{name:“Andy”}]，
列：[{data:'name'}]，
//在initComplete回调下设置自定义函数
initComplete：函数（设置，json）{
设置。\u myFilter=功能（信息）{
if（$（'#jFilter'）.prop（'checked'））{
返回（info.data.name.toLowerCase（）.indexOf（'j'）>=0）；
}否则{
返回true；
}
}
}
});
$（'#jFilter'）。在（'click'，function（）上{
dTable.draw（）；//重画将应用所有筛选器
});
})；

单击下面的复选框以使用回调按数据筛选
仅J

detailDT
是对要筛选的数据表的引用

selectedHeaderId
是我要过滤的值-在调用detailDT.draw（）触发搜索之前，其他jQuery用户交互等会设置该值

关键部分正在调用
$（detailDT.row（dataIndex.node（））；
使用当前行的回调参数dataIndex。这基本上是将该行放入一个普通的jQuery对象以获取数据属性等。
如何生成表…json或现有html？简单的建议是使用额外的列，而不是visible@charlietfl，当前为html，但我也想将其应用于json。但这真的很重要吗？啊，是的，把那个额外的隐藏列放进去，我已经有了解决办法。假设我不能使用那个选项。在json模型中，你已经有数据用作筛选值，而属性将是冗余的。在
中有
数据搜索
或
数据筛选
属性td
element允许我根据单元格的值过滤单元格。谢谢！如何在旧版上进行过滤？@davidkonrad这不适用于1.10版。您知道如何在该函数中获取“数据排序”值吗？@alwaysVBNET，您可以展示行或列标记的示例吗？您使用的是哪个版本？这是用于1.10版的.x…嘿@alwaysVBNET，它看起来不错。+1.我相信它更有效，因为您操作的是即用
设置
对象，而不是遍历方法。
<td data-label="Active">Active<br /><span class="mute">Some text</span></td>

var detailDT = $("#staging-detail-table").DataTable();

var selectedHeaderId = $(...).click...

$.fn.dataTable.ext.search.push(
       function (settings, searchData, dataIndex, rowData) {

            // This is a global call-back, so check what table is getting sent thru
            // for different search logic.
            // This is triggered any time any table is re-drawn.

            // Detail grid
            if (settings.nTable.id == "staging-detail-table") {
                if (!selectedHeaderId) {
                    // no header was selected. show everything
                    return true;
                } else {
                    var $trDetailDT = $(detailDT.row(dataIndex).node());
                    var headerId = $trDetailDT.data("headerid");

                    return selectedHeaderId == headerId;
                }
            }

            return true; // it wasnot the staging data table. Don't filter/limit.
        }
)