JavaScript - Datatables: Unterschied zwischen den Versionen
Aus Wikizone
(Die Seite wurde neu angelegt: „http://datatables.net/ "bJQueryUI": true“) |
|||
| (4 dazwischenliegende Versionen von 2 Benutzern werden nicht angezeigt) | |||
| Zeile 1: | Zeile 1: | ||
| + | |||
| + | == Links == | ||
| + | |||
| + | |||
http://datatables.net/ | http://datatables.net/ | ||
| + | http://datatables.net/forums/discussion/8348/filtering-and-sorting/p1 | ||
"bJQueryUI": true | "bJQueryUI": true | ||
| + | |||
| + | == Snippets == | ||
| + | === Standard Sortierung === | ||
| + | https://datatables.net/examples/basic_init/table_sorting.html | ||
| + | |||
| + | order option. Parameter 1 = Spalte, Parameter 2 "asc" oder "desc" | ||
| + | <syntaxhighlight lang="javascript"> | ||
| + | $(document).ready(function() { | ||
| + | $('#example').DataTable( { | ||
| + | "order": [[ 3, "desc" ]] | ||
| + | } ); | ||
| + | } ); | ||
| + | </syntaxhighlight> | ||
| + | |||
| + | === Deutsche Umlaute Sortieren === | ||
| + | JavaScript sortiert Deutsche Umlaute nicht richtig ein. Daher muß man mit Ersetzungen arbeiten. | ||
| + | |||
| + | http://www.brain4.de/programmierecke/js/arraySort.php | ||
| + | |||
| + | In Datatables kann man ein Plugin realisieren daß eine eigene Sortierroutine implementiert, die man dann wiederum setzen kann. | ||
| + | |||
| + | http://datatables.net/plug-ins/sorting und http://datatables.net/usage/columns#sType | ||
| + | |||
| + | |||
| + | <pre> | ||
| + | // Correction for datatables sorting routine | ||
| + | (function() { | ||
| + | |||
| + | function germanSort(a,b){ | ||
| + | a = a.replace(/<.*?>/g, ""); //exclude html tags | ||
| + | a = a.toLowerCase(); | ||
| + | a = a.replace(/ä/g, "ae"); //replace german Umlauts | ||
| + | a = a.replace(/ö/g, "ue"); | ||
| + | a = a.replace(/ü/g, "ue"); | ||
| + | a = a.replace(/ß/g, "ss"); | ||
| + | a = a.replace(/^der\s|^die\s|^das\s/i, ""); //exclude some german articles | ||
| + | |||
| + | b = b.replace(/<.*?>/g, ""); | ||
| + | b = b.toLowerCase(); | ||
| + | b = b.replace(/ä/g, "ae"); | ||
| + | b = b.replace(/ö/g, "ue"); | ||
| + | b = b.replace(/ü/g, "ue"); | ||
| + | b = b.replace(/ß/g, "ss"); | ||
| + | b = b.replace(/^der\s|^die\s|^das\s/i, ""); | ||
| + | |||
| + | return (a == b) ? 0 : (a > b) ? 1 : -1; | ||
| + | } | ||
| + | jQuery.extend( jQuery.fn.dataTableExt.oSort, { | ||
| + | "german-asc": function ( a, b ) { | ||
| + | return germanSort(a,b); | ||
| + | }, | ||
| + | |||
| + | "german-desc": function ( a, b ) { | ||
| + | return germanSort(a,b) * -1; | ||
| + | } | ||
| + | } ); | ||
| + | }()); | ||
| + | |||
| + | |||
| + | // INIT DATATABLE | ||
| + | $('#table_terms').dataTable({ | ||
| + | "aoColumns": [ | ||
| + | { "sType": "german" }, //custom sorting for first column | ||
| + | null, //default sorting (automatic detection) for second | ||
| + | null // s.o. | ||
| + | ], | ||
| + | ... weitere Optionen | ||
| + | }); | ||
| + | </pre> | ||
Aktuelle Version vom 3. Dezember 2015, 11:44 Uhr
Links[Bearbeiten]
http://datatables.net/forums/discussion/8348/filtering-and-sorting/p1
"bJQueryUI": true
Snippets[Bearbeiten]
Standard Sortierung[Bearbeiten]
https://datatables.net/examples/basic_init/table_sorting.html
order option. Parameter 1 = Spalte, Parameter 2 "asc" oder "desc"
$(document).ready(function() {
$('#example').DataTable( {
"order": [[ 3, "desc" ]]
} );
} );
Deutsche Umlaute Sortieren[Bearbeiten]
JavaScript sortiert Deutsche Umlaute nicht richtig ein. Daher muß man mit Ersetzungen arbeiten.
http://www.brain4.de/programmierecke/js/arraySort.php
In Datatables kann man ein Plugin realisieren daß eine eigene Sortierroutine implementiert, die man dann wiederum setzen kann.
http://datatables.net/plug-ins/sorting und http://datatables.net/usage/columns#sType
// Correction for datatables sorting routine
(function() {
function germanSort(a,b){
a = a.replace(/<.*?>/g, ""); //exclude html tags
a = a.toLowerCase();
a = a.replace(/ä/g, "ae"); //replace german Umlauts
a = a.replace(/ö/g, "ue");
a = a.replace(/ü/g, "ue");
a = a.replace(/ß/g, "ss");
a = a.replace(/^der\s|^die\s|^das\s/i, ""); //exclude some german articles
b = b.replace(/<.*?>/g, "");
b = b.toLowerCase();
b = b.replace(/ä/g, "ae");
b = b.replace(/ö/g, "ue");
b = b.replace(/ü/g, "ue");
b = b.replace(/ß/g, "ss");
b = b.replace(/^der\s|^die\s|^das\s/i, "");
return (a == b) ? 0 : (a > b) ? 1 : -1;
}
jQuery.extend( jQuery.fn.dataTableExt.oSort, {
"german-asc": function ( a, b ) {
return germanSort(a,b);
},
"german-desc": function ( a, b ) {
return germanSort(a,b) * -1;
}
} );
}());
// INIT DATATABLE
$('#table_terms').dataTable({
"aoColumns": [
{ "sType": "german" }, //custom sorting for first column
null, //default sorting (automatic detection) for second
null // s.o.
],
... weitere Optionen
});
