2010-12-16 14 views
16

Nur auf den neuesten salesorter aktualisiert und sieht aus wie seine gebrochen oder so etwas. Jedesmal, wenn ich meine Seite zu öffnen, sagt Firebug:jQuery Tablesorter Fehler

table.config.parsers undefiniert ist

Und es bricht gerade alle meine Javascript. Wenn ich die Tablesorter-Version zurücksetze, wird es funktionieren.

Javascript:

$("#List").tablesorter({ 
    widgets: ['zebra'], 
    headers: { 
     4: { sorter: false } 
    } 
}) 

HTML:

<table id="List" class="tablesort ui-widget-content ui-corner-top"> 
    <thead> 
     <tr class="ui-widget"> 
      <th>Pa&iacute;s</th> 
      <th>ISO</th> 
      <th>ISO3</th> 
      <th>CODE</th> 
      <th>&nbsp;</th> 
     </tr> 
    </thead> 
    <tbody> 
    </tbody> 
</table> 
+0

die Dokumentation der aktuellen Version durchlaufen ... kann es möglich, dass einige Funktionssignatur geändert wurde ... oder Es gibt einige Änderungen in der Konfiguration – Vivek

+0

nur mit grundlegenden Sachen ... sie nicht verändert die Hauptfunktion tablesorter(), ich bin sicher: P – alexandre

+0

können wir Ihr JavaScript und HTML sehen? – Nalum

Antwort

13

bisschen spät, aber es ist, weil Sie ein leeres/kein <tr> Element im <tbody> haben, und erwartet, dass mindestens ein <tr>.

+3

Ein Weg, wie wir es geschafft haben, ist es, mit einem Dummy zu starten, unabhängig davon, ob die Tabelle Daten enthält oder nicht, und dann über js beim Laden von Dokumenten versteckt. –

14

Ich bin gerade auf diesen Fehler gestoßen, also dachte ich, ich würde eine Antwort posten, falls jemand anderes später Probleme damit hat.

Obwohl die obige Antwort es nicht erwähnt, konnte ich den Fehler replizieren, indem zuerst salesorter() instanziiert und dann eine Sortieranforderung ausgelöst wurde.

Diese Reihenfolge der Ereignisse notwendig wäre, wenn sie mit neuen Daten über AJAX oder sonst wie so vorhandene Tabellendaten anhängt oder ersetzen:

// populate our table body with rows 
$("#myTable tbody").html(json.tbody); 

// let the sorting plugin know that we made a update 
$("#myTable").trigger("update"); 

// set sorting column and direction, this will sort on the first and third column 
var sorting = [[2,1],[0,0]]; 

// sort 
$("#myTable").trigger("sorton",[sorting]); 

Die Kombination der „update“ und der „sorton“ Ereignis scheint den Fehler auslösen. Zu dem Zeitpunkt, an dem das Ereignis "sorton" behandelt wird, wurde dem DOM nicht die Datei table.config.parsers zugewiesen - also der Fehler.

Die Korrektur besteht darin, die "sorton" -Ereignisbehandlung in einem Timeout von 1 Millisekunde zu umbrechen.

Ersetzen Sie den vorhandenen "sorton" bind in jquery.tablesorter.js (line ~ 803) mit folgendem:

}).bind("sorton", function (e, list) { 
    var me = this; 
    setTimeout(function() { 
     $(this).trigger("sortStart"); 
     config.sortList = list; 
     // update and store the sortlist 
     var sortList = config.sortList; 
     // update header count index 
     updateHeaderSortCount(me, sortList); 
     // set css for headers 
     setHeadersCss(me, $headers, sortList, sortCSS); 
     // sort the table and append it to the dom 
     appendToTable(me, multisort(me, sortList, cache)); 
    }, 1); 

tablesorter() wirklich ein praktisches Plugin ist. Danke an Christian für die Freigabe.

0

Eine andere Antwort nur für den Fall, dass jemand in das gleiche Szenario läuft, habe ich getan. Anscheinend hat der Tabellensortierer manchmal eine passende Anzahl von leeren <td> Elementen (die gleichen wie Ihre Header-Elemente) innerhalb der leeren <tr>. Mein Teilbeispiel ist unter

<thead> 
    <tr> 
     <th class="{sorter: 'text'}'' "><a href="javascript:;" title="Sort" class="arrow"><span>Network Name</span></a></th> 
     <th class="{sorter: 'text'} "><a href="javascript:;" title="Sort" class="arrow"><span>Type</span></a></th> 
     <th class="{sorter: false}"><a href="javascript:;" title="Sort" class="arrow"><span>Interconnections</span></a></th> 
     <th class="{sorter: false}">&nbsp;</th> 
    </tr> 
</thead> 

<tbody> 
    <tr style="display:none"><td></td><td></td><td></td><td></td></tr>......................... 
1

Ich habe einige der Antworten oben versucht, aber sie haben nicht auf jeder Seite geholfen, die wir mit tablesorter verwendeten. Der Hauptgrund, den ich für einen Fehler angenommen habe, ist, dass c = sortList [i] [0] nicht definiert ist, entweder weil wir ein leeres TR haben oder nicht die gleiche Anzahl von TD wie die von TH.

Ich hatte 8 TH/TD, wenn ich Tabellendaten habe und 8 TH & einzigen TD, falls ich nichts zu zeigen habe. Ich habe es geschafft, zu überprüfen, ob ich keine Tabellendaten habe, dann rufe ich nicht auf, um nach bestimmten Spalten zu sortieren, die nicht existieren. Das hat den Trick gemacht.Könnte jemand mit ähnlichem Szenario helfen

if(tableData.length != 0){ 
 
    $("#myid").tablesorter({sortList: [[2,0]]}); 
 
}

+0

Das hat mir geholfen. Vielen Dank! Ich habe sie einfach herausgefiltert, mit '.filter (function() { return $ (this) .find (" tbody> tr "). Länge> 0; }). Tablesorter (....)'. (Ich habe auch 'sortList' verwendet. Ich bin mir nicht sicher, ob das Auswirkungen hat.) –

1

Das Problem scheint zu sein, dass, wenn die Tabelle über JavaScript gefüllt ist der tablesorter nicht die neuen Inhalte nicht finden, wenn der Browser die neuen Inhalte angezeigt hat.

Das feuern des tablesorter innerhalb einer setTimeout() Routine entfernte diesen Fehler für mich.

function initPage() { 
     fillMyTable(); 
     // Init table sorter, but give the browser a second to draw the new table 
     setTimeout(function(){ $("#my_table").tablesorter(); }, 1000); 
    } 
0

Beachten Sie, dass der tablesorter AJAX example zeigt nur ein Szenario, in der neuen Zeilen sind zu den bestehenden hinzugefügt. Wenn die Tabelle dynamisch geleert und mit neuen Zeilen aufgefüllt wird, wird der obige Fehler angezeigt.

Hinzufügen eine leere Zeile

<tr style="display:none"><td></td>...<td></td></tr> 

mit der gleichen Anzahl von <td> s als Anzahl der <th> s in dem Header entfernt die Fehler, sondern stellen ein anderes: nachdem die Tabelle geleert wird und mit realen Zeilen nachgefüllt, Die neuen Zeilen werden an die alten angehängt.

Als Alternative können die tablesorter Quellcode zu ändern, versuchen Sie die folgende Aufrufsequenz:

$("#my-table").trigger("update"); 
setTimeout(function() { 
    /* e.g. sort by the second column in descending order */ 
    var sorting = [[1, 1]]; 
    $("#my-table").trigger("sorton", [sorting]); 
}, 100); 
Verwandte Themen