我用的是 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来显式指定一个分拣器,如 这个问题 的建议,但如果可能的话,我更愿意坚持使用动态检测。
第一个选项是给有货币值的列附加类"{'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>
另外,在格式化货币的函数中存在一个错误:它不能处理负数。
我已经提交了一个 虫子,并正在努力登陆一个补丁。
第二种选择是在你的tablesorter副本中应用这个修复。一旦你应用了这个修复,你就不需要在th或td's中指定货币分拣器了(反正在td's中指定也是过度杀戮)。
编辑jquery.tablesorter.js的第724行。
return $.tablesorter.formatFloat(s.replace(new RegExp([^0-9.]g),""))。
改为
return $.tablesorter.formatFloat(s.replace(new RegExp([^-0-9.]g),""))。
case.s.replace(new RegExp([^-0-9.]g),""); case:
值:$-3,1,3
目前的升序。$1,$3,$-3
预期升序 $-3,1,3
案。
价值: -$3,$1,$3 -$3,$1,$3
目前的升序为:1,3,-3美元 $1,$3,-$3
预期升序 $-3,1,3
我有一个类似的问题,发现 textExtraction
选项,当你的单元格中包含标记时,建议使用该选项。然而,它作为一个预格式化的格式器也能很好地工作!我使用了这样的东西,它对我很有效。
$('table').tablesorter({
textExtraction: function(s) {
var text = $(s).text();
if (text.charAt(0) === '$') {
return text.replace(/[^0-9-.]/g, '');
} else {
return text;
}
}
});
我使用了这样的东西,它为我工作。
在页眉< th class="{'sorter':'digit'}"> 和列< td class="{'sorter':'digit'}">中使用这个类。
一旦完成,在javascript代码中进行修改,以获得所有货币的数字形式。
它完成了,享受排序吧!
下面是代码。
HEADER .COLUMN (td): :
<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;
}
}
});