Ausschließen einer Spalte von sortierten mit jQuery tablesorter

Ich bin auf der Suche nach einer Möglichkeit zum Ausschließen einer einzelnen Spalte von sortierten mit jQuery's Tablesorter-Plugin. Insbesondere habe ich eine ziemlich große Tabelle und möchte eine "Zeilennummer" -Spalte fixieren, so dass es einfach ist, nach dem Sortieren zu sehen, welche Position in der Tabelle eine bestimmte Zeile ist.Ausschließen einer Spalte von sortierten mit jQuery tablesorter

Zum Beispiel:

# name 
----------- 
1 papaya 
2 apple 
3 strawberry 
4 banana

Wenn Sie auf den Namen Spalte sortiert, sollte in Folge:

# name 
----------- 
1 apple 
2 banana 
3 papaya 
4 strawberry

Dank.

Quelle

2009-01-12 Chad Birch

Hier ist ein Widget, das Sie das wird erreichen können, was Sie suchen:

$(function() { 
    // add new widget called indexFirstColumn 
    $.tablesorter.addWidget({ 
     // give the widget a id 
     id: "indexFirstColumn", 
     // format is called when the on init and when a sorting has finished 
     format: function(table) {    
      // loop all tr elements and set the value for the first column 
      for(var i=0; i < table.tBodies[0].rows.length; i++) { 
       $("tbody tr:eq(" + i + ") td:first",table).html(i+1); 
      }         
     } 
    }); 

    $("table").tablesorter({ 
     widgets: ['zebra','indexFirstColumn'] 
    }); 

});

Quelle

2009-01-12 23:12:50

Sehr schön! Ich denke, dass in der for-Schleife sollte <=> und nicht < Marcin

Tolles Zeug, eine kleine Sache, aber es sollte keine Schleife von 'var i = 0;' sondern 'var i = 1;' sonst wird 0 Index am Ende der Tabelle bekommen. – Marcin

Hrm. Ich bin mir ziemlich sicher, dass das aus der Tablesorter-Methode zur Reorganisation der Tabelle nicht möglich ist. Der Tablesorter zieht jedes tr aus dem DOM nacheinander und sortiert sie basierend auf einem indizierten Feld, wobei das gesamte tr neu eingefügt wird, ohne den Inhalt des tr zu verändern. Ihre angeforderte Lösung müsste dann nach jeder Sortierung durch die Tabelle iterieren und die erste Spalte erneut aufzählen. Tablesorter hat eine Plugin-Methode, die vom Zebrastreifen und anderen Erweiterungen verwendet wird. Vielleicht könnte dies verwendet werden, um die Sortiermethoden zu haken?

Quelle

2009-01-12 22:50:05 yaauie

Bearbeiten: Ich habe eine Probe dieser Technik bei http://jsbin.com/igupu4/3 gemacht haben. Klicken Sie auf eine Spaltenüberschrift, um zu sortieren ...

Ich habe keine Antwort auf Ihre Frage zu Jquery, hier ist eine alternative Möglichkeit, das spezifische Verhalten zu erhalten, das Sie hier beschrieben, feste Zeilennummern nach dem Sortieren. (. Mit CSS, speziell die content property und counter related properties/functions)

<html> 
<head> 
    <title>test</title> 
    <style type="text/css"> 
    tbody tr 
    { 
     counter-increment : rownum ; 
    } 
    tbody 
    { 
     counter-reset: rownum; 
    } 
    table#sample1 td:first-child:before 
    { 
     content: counter(rownum) " " ; 
    } 
    table#sample2 td.rownums:before 
    { 
     content: counter(rownum) ; 
    } 
    </style> 
    <script src="jquery-1.2.6.min.js" ></script> 
    <script src="jquery.tablesorter.min.js" ></script> 
    <script> 
    $(document).ready(function() 
     { 
     $("table").tablesorter(); 
     } 
    ); 
    </script> 
</head> 

<body> 
    <table id="sample1"> 
    <thead> 
     <tr> 
     <th>Col 1</th> 
     <th>Col 2</th> 
    </thead> 
    <tbody> 
     <tr> 
     <td> 
      <p>foo</p> 
     </td> 
     <td> 
      <p>quuz</p> 
     </td> 
     </tr> 

     <tr> 
     <td>bar</td> 
     <td>quux</td> 
     </tr> 

     <tr> 
     <td>baz</td> 
     <td>baz</td> 
     </tr> 
    </tbody> 
    </table> 

    <table id="sample2"> 
    <thead> 
     <tr> 
     <th>Rownums</th> 
     <th>Col 1</th> 
     <th>Col 2</th> 
     <th>More Rownums</th> 
    </thead> 
    <tbody> 
     <tr> 
     <td class="rownums"></td> 
     <td> 
      <p>foo</p> 
     </td> 
     <td> 
      <p>bar</p> 
     </td> 
     <td class="rownums"></td> 
     </tr> 

     <tr> 
     <td class="rownums"></td> 
     <td>quuz</td> 
     <td>baz</td> 
     <td class="rownums"></td> 
     </tr> 

     <tr> 
     <td class="rownums"></td> 
     <td>fred</td> 
     <td>quux</td> 
     <td class="rownums"></td> 
     </tr> 
    </tbody> 
    </table> 
</body> 
</html>

Falls Ihr Browser ausreichend CSS2.1 kompatibel ist, können Sie tr verwenden: vor statt td: first-child: vor in Probe 1 (Mozilla only supports this in trunk for now...)

In Beispiel 2 können Sie sehen, wie Sie Ihre Zeilennummernspalten überall und nicht nur in der ersten Spalte positionieren.

Quelle

2009-01-13 00:18:32 Stobor

Für diejenigen, die diese während Suche nach einem Weg finden eine Spalte ist sortierbar (dh klickbare Header auf der Säule), die unter Beispiel schließt Spalte 4 (Null-Index) ausschließen aus werden sortiert):

$("table").tablesorter({ 
    headers: {4: {sorter: false}} 
});

Quelle

2012-10-16 23:41:33 bcoughlan

Dies würde die Sortierung für die erste Spalte überspringen und es für die zweite Spalte zulassen. Setzen Sie für alle Spalten, die mit der ersten Spalte beginnen, den Wert "0" auf "wahr".

Quelle

2014-03-06 16:14:55 user3389065

Die Antwort von Brian Fisher ist korrekt, aber es ist in großen Tabellen zu langsam (in meinem Beispiel +1600 Zeilen). Ich habe die Art der Iteration durch jede Zeile verbessert. Alles andere ist gleich.

$(function() { 
    // add new widget called indexFirstColumn 
    $.tablesorter.addWidget({ 
     // give the widget a id 
     id: "indexFirstColumn", 
     // format is called when the on init and when a sorting has finished 
     format: function(table) {    
      // loop all tr elements and set the value for the first column 
      $(table).find("tr td:first-child").each(function(index){ 
       $(this).text(index+1); 
      })         
     } 
    }); 

    $("table").tablesorter({ 
     widgets: ['zebra','indexFirstColumn'] 
    }); 
});

Quelle

2016-10-25 09:48:04 Hubert

$("table").tablesorter({ 
    headers: {4: {sorter: false},8: {sorter: false}} 
});

Quelle

2016-11-15 12:16:56

Die Antwort von Stobor ist perfekt. Das einzige Problem ist, dass gewartet werden muss, bis die Tabelle komplett gerendert ist, um die Zahlen zu setzen.

Einige Beobachtungen:

Sie benötigen eine leere Spalte für diese Methode, die Zahlen geben setzen.
Wenn Sie Header in der Tabelle haben, müssen Sie die Tags THEAD und TBODY verwenden, damit satter sorter nur die Daten im Abschnitt TBODY sortiert.
Wenn Sie eine Fußzeile in Ihren Tabellen haben, müssen Sie dies aus der TBODY-Sektion herauslassen, um Tabellensorter zu vermeiden, um seine Inhalte zu sortieren, auch müssen Sie Tags TH anstelle von TD verwenden, um die Fußzeile nicht zu nummerieren.

Anmerkung: Das Verfahren, durch Abdul gezeigt schränkt nur den Benutzer durch die angegebenen Spalten zu sortieren, aber sein Gehalt ist immer mit dem Rest der Reihe geordnet, wenn eine Bestellung von anderen unbeschränkten Spalt ausgewählt ist.

Quelle

2016-11-17 19:49:26 Jorge

Ausschließen einer Spalte von sortierten mit jQuery tablesorter

Antwort

Verwandte Themen