Soeben habe ich für einen Kumpel einen Parser für den jQuery Tablesorter geschrieben, welcher das deutsche Datumsformat im Format dd.mm.yyyy verarbeiten kann. Der Parser an sich ist relativ einfach, da man einfach das Datum in einen Timestamp umwandelt und dann sortiert.
Erstmal nur der Sorter:
1
2
3
4
5
6
7
8
9
10
11
12
| $.tablesorter.addParser({
id: 'germandate',
is: function(s) {
return false;
},
format: function(s) {
var a = s.split('.');
a[1] = a[1].replace(/^[0]+/g,"");
return new Date(a.reverse().join("/")).getTime();
},
type: 'numeric'
});
|
Das komplette Beispiel sieht dann so aus:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
| <html>
<head>
<script type="text/javascript" src="jquery-latest.js"></script>
<script type="text/javascript" src="jquery.tablesorter.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$.tablesorter.addParser({
id: 'germandate',
is: function(s) {
return false;
},
format: function(s) {
var a = s.split('.');
a[1] = a[1].replace(/^[0]+/g,"");
return new Date(a.reverse().join("/")).getTime();
},
type: 'numeric'
});
$("#example").tablesorter({
headers: { 1: { sorter:'germandate' }}
});
});
</script>
</head>
<body>
<table id="example" class="tablesorter" border="0" cellpadding="0" cellspacing="1">
<thead>
<tr>
<th class="header">Event</th>
<th class="header">Datum</th>
</tr>
</thead>
<tbody>
<tr>
<td>Event 1</td>
<td>06.06.2000</td>
</tr>
<tr>
<td>Event 2</td>
<td>06.06.1992</td>
</tr>
<tr>
<td>Event 3</td>
<td>05.09.2009</td>
</tr>
<tr>
<td>Event 4</td>
<td>01.04.2002</td>
</tr>
<tr>
<td>Event 5</td>
<td>20.05.2014</td>
</tr>
<tr>
<td>Event 6</td>
<td>30.01.2001</td>
</tr>
</tbody>
</table>
</body>
</html>
|
Und das Beispiel nochmal gezeigt:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
| <script type="text/javascript" src="https://wolf-u.li/upload/blog/2963/jquery.tablesorter.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery.tablesorter.addParser({
id: 'germandate',
is: function(s) {
return false;
},
format: function(s) {
var a = s.split('.');
a[1] = a[1].replace(/^[0]+/g,"");
return new Date(a.reverse().join("/")).getTime();
},
type: 'numeric'
});
jQuery("#example").tablesorter({
headers: { 1: { sorter:'germandate' }}
});
});
</script>
<table id="example" class="tablesorter" border="0" cellpadding="0" cellspacing="1">
<thead>
<tr>
<th class="header">Event</th>
<th class="header">Datum</th>
</tr>
</thead>
<tbody>
<tr>
<td width="150">Event 1</td>
<td>06.06.2000</td>
</tr>
<tr>
<td>Event 2</td>
<td>06.06.1992</td>
</tr>
<tr>
<td>Event 3</td>
<td>05.09.2009</td>
</tr>
<tr>
<td>Event 4</td>
<td>01.04.2002</td>
</tr>
<tr>
<td>Event 5</td>
<td>20.05.2014</td>
</tr>
<tr>
<td>Event 6</td>
<td>30.01.2001</td>
</tr>
</tbody>
</table>
|
So einfach is dat :)