我正在尝试使用最新的Jquery Table sorter插件。 http://mottie.github.com/tablesorter/docs/#Demo
问题是我有一个带有日期格式的表格列,它还包含一个电子邮件值。我正在尝试提取日期值并根据日期值对其进行排序。
由于我使用的是最新版本的Table sorter,我尝试使用最新版本中提供的解析器类名(http://mottie.github.com/tablesorter/docs/example-parsers-class-name.html)。
请在下面找到我的小提琴。
http://jsfiddle.net/meetravi/pztqe/8/
代码段:
<tr>
<th>Name</th>
<th>Major</th>
<th>Sex</th>
<th>English</th>
<th>Japanese</th>
<th>Calculus</th>
<th>Geometry</th>
<th class="sorter-shortDate">Date</th>
</tr>
<tbody>
<tr>
<td>Student01</td>
<td>Languages</td>
<td>male</td>
<td>80</td>
<td>70</td>
<td>75</td>
<td>80</td>
<td><em>11/01/12 11:42</em><spanclass="label">xyz@xyz.com</span></td>
</tr>
</tbody>
<script type="text/javascript">
$(document).ready(function(){
$('#table-Id').tablesorter({
theme: 'blue',
dateFormat : "ddmmyy",
textExtraction: {
7: function(node, table, cellIndex) {
return $(node).find("em").text();
}
}
});
});
</script>
答案 0 :(得分:1)
首先,跨度和类之间应该有一个空格。
其次,日期解析器仅设置为使用4位数年份ddmmyyyy
。请参阅this issue以获得适用于2位数年份的解析器,但请阅读所有内容以了解IE如何处理2位数年份。
<td><em>11/01/2012 11:42</em><span class="label">xyz@xyz.com</span></td>
第三,由于日期列的内容,您需要在标题中设置分拣机选项:
headers: {
7: { sorter: 'shortDate' }
}
最后,演示中有两个textExtraction
选项。第二个,而不是你上面发布的那个,覆盖了这个功能。你写的那个完美无缺:)
Here is a demo上述变化。
更新:这是使用以下解析器代码的updated demo:
$.tablesorter.addParser({
id: "ddmmyy",
is: function(s) {
return false;
},
format: function(s, table, cell, cellIndex) {
s = s
// replace separators
.replace(/\s+/g," ").replace(/[\-|\.|\,]/g, "/")
// reformat dd/mm/yy to mm/dd/yy
.replace(/(\d{1,2})[\/\s](\d{1,2})[\/\s](\d{2})/, "$2/$1/$3");
var d = new Date(s), y = d.getFullYear();
// if date > 50 years old, add 100 years
// this will work when people start using "70" and mean "2070"
if (new Date().getFullYear() - y > 50) {
d.setFullYear( y + 100 );
}
return d.getTime();
},
type: "numeric"
});