JQuery: Tablesorter-Plugin Erweiterung für das deutsche Datumsformat “dd.mm.yy hh:mm”
Mit dem Tablesorter-Plugin von Christian Bach kann eine Tabelle schnell und wirklich elegant aufgewertet werden. Das Plugin ermöglicht eine Sortierung über Tabellenspalten. In dem Plugin sind bereits einige Sortieralgorithmen implementiert, allerdings ist eine Sortierung einer Tabellenspalte mit deutschem Datumsformat nicht möglich.
Das Tablesorter-Plugin bietet aber die Möglichkeit einen eigenen Sortieralgorithmus zu definieren und später einer Tabellenspalte zuzuweisen. Genau diesen Schritt hat Ulrich bereits getan und für das deutsche Datumsformat einen Parser erstellt. Dieser Parser stellt einen Sortieralgorithmus für das Datum im deutschen Datumsformat (dd.mm.yyyy) zur Verfügung.
$.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'
});
Für ein Projekt benötigte ich genau solch einen Parser, allerdings im Datetime-Format, also inkl. Stunden- und Minutenangabe. Dafür habe ich einfach das vorhandene Skript von Ulrich erweitert, so dass das Datetime-Format in der Form “dd.mm.yyyy hh:mm” geparst werden kann. Der folgende Parser sortiert also anhand des Datetime-Formats “dd.mm.yyyy hh:mm“:
$.tablesorter.addParser({
id: 'germandatetime',
is: function(s) {
return false;
},
format: function(s) {
var a = s.split('.');
a[1] = a[1].replace(/^[0]+/g,"");
tmp = a[2].split(' ');
a[2] = tmp[0];
t = tmp[1].split(':');
return new Date(a[2],a[1]-1,a[0],t[0],t[1],0).getTime();
},
type: 'numeric'
});
Eingebunden in das Tablesorter-Plugin sieht die Variante dann folgendermaßen aus:
$(document).ready(function(){
$.tablesorter.addParser({
id: 'germandatetime',
is: function(s) {
return false;
},
format: function(s) {
var a = s.split('.');
a[1] = a[1].replace(/^[0]+/g,"");
tmp = a[2].split(' ');
a[2] = tmp[0]
t = tmp[1].split(':');
return new Date(a[2],a[1]-1,a[0],t[0],t[1],0).getTime();
},
type: 'numeric'
});
$("#example").tablesorter({
headers: { 1: { sorter:'germandatetime' }}
});
});
Vielen Dank noch einmal an Ulrich für den Grundstein des Parsers.
Danke Dennis. Genau das habe ich gesucht. Du hast in deinem Script noch einen kleinen Fehler. Am Ende von Zeile 10 fehlt der ‘;’
a[2] = tmp[0]
Hey Alex,
da hat sich wohl der Fehlerteufel eingeschlichen – ich habe es geändert. Vielen Dank für deinen Hinweis.
Gruß
Hallo,
danke für den Beitrag, der Parser für das Datum fehlte mir noch – und passt perfekt zu meinem Parser für euro-Beträge.
grüße
Tolles Plugin. Funktioniert bei mir einwandfrei mit WordPress 3.0.1.
Kannst Du auch ein Plugin programmieren, dass über XML Daten an andere Schnittstellen übergibt ?
Gruss aus Frechen
Jens Berger
Funktioniert bei mir nur in IE …
Ich gebe nun mal in format:… als ersters alert(s) raus.
In IE habe ich den Wert, in FF ist das leer?
Ich denke, das Problem kommt irgendwie daher, dass die Tabelle per ajax geladen wird, kann das sein und gibt es eine Abhilfe?
Gruss
Thomas
Hey Thomas,
das kann ich pauschal nicht sagen. Ich würde dir aber anbieten, dass du mir deinen Source-Code mal per Mail schickst und ich mal einen Blick darauf werfe.
Viele Grüße,
Dennis
Danke für diese kleine Erweiterung.
Etwas sollte noch hinzugefügt werden: eine Abfrage, ob die Zelle überhaupt gefüllt ist. Ich habe das mit einer “if (a.length > 1)” Abfrage nach dem ersten Split gelöst und gebe im else-Zweig einfach eine 0 zurück.
Gruß
sc911