Javascript jquery数据表中的动态排序

我使用带有选项的DataTables来实现表的自定义排序。当sort函数中的逻辑仅依赖于静态数据时，这就可以正常工作。但是，我想为我的用户提供一些控制排序方式的控件。问题是DataTables似乎正在缓存第一个排序结果，因此当用户尝试更改排序控件时，它没有任何效果

简而言之，我想要一个动态排序函数

显然，最好用一个例子来解释这一点。其想法是允许“信息”列按“客户名称”或“价格”排序，这取决于用户在表格上方的收音机中选择的内容。运行它，您将看到排序仅适用于初始无线电选择

$（函数（）{
变量选项={
“栏目”：[{
“可搜索”：false
}, {
“呈现”：函数（数据、类型、行、元）{
如果（类型=='sort'）{
var sel=$（“输入[name=infoFilterOptions]：选中”）.val（）；
返回$（sel，$（data））.data（'value'）；
}
返回数据；
}
}]
};
$（“U表”）。数据表（opts）；
});

按以下方式对信息列进行排序：
价格
客户名称
身份证件
信息
1.
客户名称：约翰
价格:$42.42
3.
客户名称：Melvyn
价格：$14.00
18
客户名称：Aaaardvark
价格:$22.30
艾伦反复回答了这个问题。一流的支持，一如既往

简而言之，DataTables确实在缓存排序结果。您需要使表中的数据无效（通过
row（）.invalidate（）
或
rows（）.invalidate（）
）以重新计算排序顺序

这就是诀窍：

$('input[type=radio][name=infoFilterOptions]').on('change', function() {
    $("#the_table").DataTable().rows().invalidate();
});

下面是上面的完整示例，包括此修复：


$（函数（）{
变量选项={
“栏目”：[{
“可搜索”：false
}, {
“呈现”：函数（数据、类型、行、元）{
如果（类型=='sort'）{
var sel=$（“输入[name=infoFilterOptions]：选中”）.val（）；
返回$（sel，$（data））.data（'value'）；
}
返回数据；
}
}]
};
$（“U表”）。数据表（opts）；
$（'input[type=radio][name=infoFilterOptions]'）。在（'change'，function（）上{
$（“#表”）.DataTable（）.rows（）.invalidate（）；
});
});

按以下方式对信息列进行排序：
价格
客户名称
身份证件
信息
1.
客户名称：约翰
价格:$42.42
3.
客户名称：Melvyn
价格：$14.00
18
客户名称：Aaaardvark
价格:$22.30