我有一个动态构建的jquery数据表,这意味着每一行都是使用php mysql数据库调用构建的。创建表本身没有问题,但有时我想向集合中显示的数据添加超链接。
例如:ID | Date | Amount
----------------------------
1 | April 1, 2011 | 3.95
2 | April 5, 2011 | 4.55
3 | May 9, 2011 | 19.32
问题是,上面的日期将是一个超链接,URL中的日期格式将是YYYY-mm-dd格式。
当我这样做时,数据表想要将整个URL视为数据元素,从而在事实之后打乱我可以对表进行的任何排序。
以前有人遇到过这个问题吗?我好像在网上找不到任何东西。
要对非标准列进行排序,您可以定义特定的函数:这里可以找到其中的一些:http://datatables.net/plug-ins/sorting.
在您的例子中,您可以这样定义自己的排序函数:
jQuery.fn.dataTableExt.oSort['my-date-asc'] = function(a,b) {
var x = a.match(/date=(.*?)"/)[1].toLowerCase();
var y = b.match(/title="(.*?)"/)[1].toLowerCase();
x = x.replace(/-/g, '');
y = y.replace(/-/g, '');
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
};
jQuery.fn.dataTableExt.oSort['title-string-desc'] = function(a,b) {
var x = a.match(/date=(.*?)"/)[1].toLowerCase();
var y = b.match(/date=(.*?)"/)[1].toLowerCase();
x = x.replace(/-/g, '');
y = y.replace(/-/g, '');
return ((x < y) ? 1 : ((x > y) ? -1 : 0));
};
您可以在该列上使用fnRender()来返回您希望该列显示的任何html。
bUseRendered: true,
fnRender: function(oObj) {
var id = oObj.aData[0];
var normalDate = oObj.aData[1];
var amount = oObj.aData[2];
var urlDate = oObj.aData[3];
var isUrlDate = oObj.aData[4];
if (isUrlDate) {
return urlDate;
}
else {
return normalDate;
}
}
注意
bUseRendered: false
这告诉数据表"排序时使用传回的数据而不是呈现的html "
oObj。aData返回该行的列数据。您可以返回两个额外的HIDDEN列,其中包含执行该逻辑所需的数据。然后你的排序仍然可以工作,你也可以访问你需要的url(如果存在的话)。
我的猜测是,如果没有链接,这种排序很好,但因为在列中有一个链接(html),它不像您期望的那样工作。对我来说,这听起来和日期关系不大,更多的是和HTML有关…
我发现了这个:Jquery datatable插件似乎不能正确排序带有链接的列