Ich lade eine Tabelle mit allen Zeilen vor. Ich möchte jedoch nur die obersten 10 Zeilen anzeigen, die sich innerhalb des <tbody> -Tags und jetzt alle <tr> in der Tabelle befinden.
Also hier ist was ich bisher gemacht habe:
%Vor%Das Problem mit dem obigen Code ist:
<tr> mit dem <tbody> -Tag. seeMoreRecords verstecken, wenn alle angezeigt werden. seeLessRecords aus. Abschließend sieht mein Skript standardmäßig 10 Zeilen vor. Wenn der Benutzer mehr Klicks sieht, werden 10 weitere angezeigt. Es ist also ein Inkrement von 10 auf einmal und sobald Sie Max drücken, verstecken Sie die Schaltfläche "Mehr sehen". Weniger anzeigen ist nur sichtbar, wenn mehr als 10 Zeilen angezeigt werden.
Sie können den Selektor $("#internalActivities tr") verwenden, der alle <tr> unabhängig von <tbody> oder nicht
Sie müssen den aktuell angezeigten Index in einer separaten Variablen speichern oder den aktuellen Index basierend auf der Anzahl der ausgewählten Elemente berechnen (verwenden Sie die .length -Eigenschaft)
Überprüfen Sie die aktuelle Anzahl der angezeigten Elemente und zeigen / verbergen Sie die entsprechenden Schaltflächen.
Ich habe eine jsFiddle-Demo erstellt, um dies in Aktion zu sehen.
1) Wenn Sie die tr-Tags nicht nur mit dem tbody-Tag benötigen, schreiben Sie Ihre jquery erneut in
%Vor%2) Sie können die Anzahl der Zeilen ermitteln und diese Anzahl in der Scheibe verwenden
%Vor%3) Überprüfen Sie die Anzahl der ausgeblendeten Zeilen im Ereignis-Handler seeMoreRecords click
%Vor%4) Überprüfen Sie die Anzahl der angezeigten Zeilen
%Vor%