我正在使用jQuery Tablesorter并且对表格列应用解析器的顺序存在问题。我正在添加一个自定义解析器来处理$ -3.33格式的货币。
$.tablesorter.addParser({
id: "fancyCurrency",
is: function(s) {
return /^\$[\-]?[0-9,\.]*$/.test(s);
},
format: function(s) {
s = s.replace(/[$,]/g,'');
return $.tablesorter.formatFloat( s );
},
type: "numeric"
});
问题似乎是内置货币解析器优先于我的自定义解析器。我可以将解析器放在tablesorter代码本身(在货币解析器之前)并且它正常工作,但这不是很容易维护。我无法使用以下内容手动指定分拣机:
headers: {
3: { sorter: "fancyNumber" },
11: { sorter: "fancyCurrency" }
}
因为表列是从用户输入动态生成的。我想一个选项是指定分类器用作css类,并使用一些JQuery明确指定像this question建议的分类器,但如果可能的话,我宁愿坚持使用动态检测。
答案 0 :(得分:9)
第一个选项是为具有货币值的列提供额外的类“{'sorter':'currency'}”。还要确保包含哪些tablesorter支持的插件元数据。这将引入每个元素选项并明确告诉tablesorter如何排序。
<link rel="stylesheet" href="/css/jquery/tablesorter/green/style.css" />
<script src="/js/jquery-1.3.2.js"></script>
<script src="/js/jquery.ui.core.js"></script>
<script src="/js/jquery.metadata.js"></script>
<script src="/js/jquery.tablesorter.js"></script>
<script>
$(document).ready(function()
{
$("#table").tablesorter();
}
);
</script>
</head>
<table id="table" class="tablesorter">
<thead>
<tr>
<th class="{'sorter':'currency'}">Currency</th>
<th>Integer</th>
<th>String</th>
</tr>
</thead>
<tbody>
<tr>
<td class="{'sorter':'currency'}">$3</td>
<td>3</td>
<td>three</td>
</tr>
<tr>
<td class="{'sorter':'currency'}">-$3</td>
<td>-3</td>
<td>negative three</td>
</tr>
<tr>
<td class="{'sorter':'currency'}">$1</td>
<td>1</td>
<td>one</td>
</tr>
</tbody>
</table>
此外,格式化货币的功能存在一个错误:它不处理负数。
我已经提交了bug,正在努力登陆补丁。
第二个选项是将此修复程序应用于您的tablesorter副本。一旦你应用了修复,你将不需要在th或td中指定货币分类器(无论如何在td中指定是过度杀死)。
编辑jquery.tablesorter.js的第724行:
返回$ .tablesorter.formatFloat(s.replace(new RegExp(/ [^ 0-9。] / g),“”));
更改为:
返回$ .tablesorter.formatFloat(s.replace(new RegExp(/ [^ - 0-9。] / g),“”));
案例:
值:$ -3,$ 1,$ 3
当前的asc订单:$ 1,$ 3,$ - 3
预计asc订单$ -3,$ 1,$ 3
案例:
值: - $ 3,$ 1,$ 3
当前的asc订单:$ 1,$ 3, - $ 3
预计asc订单$ -3,$ 1,$ 3
答案 1 :(得分:2)
我遇到了类似的问题,发现当您的单元格包含标记时,建议使用textExtraction
选项。但是,它作为预格式化格式化器非常有效!
$('table').tablesorter({
textExtraction: function(s) {
var text = $(s).text();
if (text.charAt(0) === '$') {
return text.replace(/[^0-9-.]/g, '');
} else {
return text;
}
}
});
答案 2 :(得分:0)
我使用过这样的东西,它对我有用。
在标题中使用此类&lt; th class =“{'sorter':'digit'}”&gt;并且在列中&lt; td class =“{'sorter':'digit'}”&gt;。
完成后,在javascript代码中进行更改,以便以数字形式获取所有货币。
它完成了,享受排序!!!
以下是代码:
HEADER:
<th style='width: 98px;' class="{'sorter':'digit'}">
Amount
</th>
COLUMN(td):
<td align="left" style='width: 98px;' class="{'sorter':'digit'}">
<%= Convert.ToDouble( a.AMOUNT ?? 0.0).ToString("C3") %>
</td>
JAVASCRIPT:
<script language="javascript" type="text/javascript">
jQuery("#rewardtable").tablesorter({
textExtraction: function (data) {
var text = $(data).text();
if (text.toString().indexOf("-$") != -1) {
return ("-" + text.replace(new RegExp(/[^0-9.]/g), ""));
}
else if (text.toString().indexOf("$") != -1) {
return (text.replace(new RegExp(/[^-0-9.]/g), ""));
}
else {
return text;
}
}
});