如何让jQuery DataTables对隐藏值进行排序，但搜索显示值？
我有一个简单的DataTables网格，其中包含日期列。我在JSON数据集中为日期提供了两个值，一个用于显示，另一个专门设计，以便DataTable可以对其进行排序。我的Web应用程序允许用户选择一堆不同的日期格式，因此它需要灵活。如何让jQuery DataTables对隐藏值进行排序，但搜索显示值？
这是我的JSON数据，DataTables通过sAjaxSource从Web服务器获取。
{
Reports : [
{ Date: { Sort = "20101131133000", Display : "11/31/2010 1:30 PM" } },
{ Date: { Sort = "20100912120000", Display : "1200 EST 2010-09-12" } },
]
}
这是很容易告诉数据表基础上，Date.SortValue属性进行排序，并通过使用fnRender()使Display属性对用户可见。所以这使我获得了一半的目标。
var dataTableConfig = {
sAjaxSource: "/getreports",
sAjaxDataProp: "Reports",
aoColumns: [
{ mDataProp: "User" },
{ mDataProp: "Date.Sort",
bSortable: true,
sName: "Date",
bUseRendered: false,
fnRender: function (oObj) {
return oObj.aData[oObj.oSettings.aoColumns[oObj.iDataColumn].sName].Display;
}
}
]
};
这里是我的问题。我想允许用户根据显示的值输入过滤器（使用DataTables提供的内置过滤器输入），但它们不能。
例如。如果用户输入“EST”，则他们将得到零结果，因为数据表根据mDataProp中指定的值进行过滤，而不基于从fnRender返回的值。
任何人都可以帮我弄清楚如何排序和筛选日期列？谢谢。
这是一篇旧帖子，但希望这可以帮助别人来到这里。
在较新版本的DataTable中，不推荐使用bUseRendered和fnRender。
mRender是做这种事情的新方法，有一个稍微不同的方法。
你能解决您的问题沿着线的东西：
...
{ mDataProp: "Date.Sort"
bSortable: true,
sName: "Date",
// this will return the Display value for everything
// except for when it's used for sorting,
// which then it will use the Sort value
mRender: function (data, type, full) {
if(type == 'sort') return data.Sort;
return data.Display
}
}
...
尝试一点点不同的方法：
把两个表中的列（我会打电话给他们DateDisplay和DateSort），不使用渲染功能，只是隐藏DateSort列。然后在列DateDisplay的aoColumns数组中输入{ "iDataSort": 2 }，其中2是DateSort列的索引。
在这种情况下，DateDisplay列将显示在原始数据中，并且过滤器将由此列完成，但排序将通过DateSort列中的值完成。
有关数据表站点或http://www.codeproject.com/KB/scripting/JQuery-DataTables.aspx“配置排序”部分中的iDataSort属性的更多详细信息。
@ CWSpear的答案更容易实现，我认为。 – Jess
此答案适用于传统数据表，现在已弃用 –
+1 JocaPC
我想提醒大家的是，JavaScript的使用零索引的数组添加到JocaPC的答案。
例子：
HiddenSortString (0) | Date (1) | Some Text (2) ................................................................... 1349035566 | September 30, 2012 2:06 pm | blah blah 1349118137 | October 01, 2012 1:02 pm | blah blah 1349371297 | October 04, 2012 11:21 am | blah blah ...................................................................
要使用隐藏的字符串，你可以使用以下排序日期字段。
$('.mytable').dataTable({
"aoColumns": [{"bVisible": false},{"iDataSort": 0},null]
});
我相信现有的答案由于DataTables的更新而不推荐使用。 HTML5支持DataTables可用来轻松对列进行排序的属性。具体来说就是data-sort属性。 （见https://datatables.net/examples/advanced_init/html5-data-attributes.html）
我可以很容易地像这样排序表：
<table>
<thead>
<tr>
<td>Name</td>
<td>Age</td>
</tr>
</thead>
<tbody>
<tr>
<td>John Doe</td>
<td data-sort="37">2/1/78 (37 years old)</td>
</tr>
<tr>
<td>Jane Doe</td>
<td data-sort="35">12/1/80 (35 years old)</td>
</tr>
</tbody>
</table>
不要紧的“年龄”列中包含数字，符号和字母，将数据表排序使用“数据 - 排序'属性。
您必须按隐藏列（排序）对列进行排序。为此，您必须包含一个包含排序数据的列，隐藏列并按隐藏列排列显示列。
"aoColumnDefs:[
{"sTitle": "Display", "iDataSort":1, "aTargets":[2]},
{"bVisible": false, "aTargets":[2]}
],
aoColumns: [
{ mData: "User" },
{ mData: "Display"},
{ mData: "Sort"}
]
既然您已经有了可排序和可显示格式的数据，这就是您需要的所有代码。
它将使用Date.Sort进行分类，Date.Display用于视觉效果。这是记录here。
columns: [{
data: 'Date',
render: {
_: 'Display',
sort: 'Sort'
}
}]
这应该是被接受的答案。 –
自从更新数据表后，此问题的正确答案已更改。我不确定在改变接受的答案和更新答案方面，SO政策是什么，但其中一个或另一个可能会得心应手？ –
我很乐意改变接受的答案。我不再使用DataTable，你能告诉哪一个更好吗？ – jessegavin
CW Spear的回答标有'13年11月5日在7：12'似乎是正确的，并为我工作。 –