Ich habe eine Tabelle, die Daten in verschiedenen Ebenen (Parent, Child, Grandson) zeigt, wenn ich auf das Elternelement klickt, zeigt es neue Zeilen für die untergeordnete Ebene an, und wenn ich auf Kind klicke zeigt es ein dritte Stufe als der Enkel mit mehr Reihen.Hinzufügen einer Aktion zur Schaltfläche mit jQuery
Was ich tun möchte, ist eine Schaltfläche auf jedem Datensatz mit dem "+" - Symbol, so dass ich die zweite Ebene zu sehen und wechseln Sie diese Schaltfläche von der Eltern mit dem "-" Symbol , um die Funktion zum Erweitern und Reduzieren zu simulieren, möchte ich dies auch für die untergeordnete Ebene tun.
Jetzt erweitern oder reduzieren die Spalten, wenn ich auf eine Zeile klicke, aber ich möchte dies tun, wenn ich auf die Schaltflächen klicke, die ich hinzufügen möchte.
Hier ist mein Code:
$('.drillDown tr td:last-child, .drillDown tr th:last-child').hide();
$('.drillDown tr td:first-child, .drillDown tr th:first-child').dblclick(function(){
$('.drillDown tr td:last-child, .drillDown tr th:last-child').show();
})
$('table.drillDown').each(function() {
var $table = $(this);
$table.find('.parent').dblclick(function() {
console.log("*****Click on Parent");
$(this).nextUntil('.parent', ".child").toggle("fast");
$(this).nextUntil('.parent', ".grandson").hide("fast");
});
$table.find('.child').dblclick(function() {
console.log("*****Click on child");
$(this).nextUntil('.child', ".grandson").toggle("fast");
});
var $childRows = $table.find('tbody tr').not('.parent').hide();
$table.find('button.hide').dblclick(function() {
$childRows.hide();
});
$table.find('button.show').dblclick(function() {
console.log("*****Click on Child");
$childRows.filter('.child').show();
});
$table.find('tr.child').dblclick(function(){
$(this).nextUntil('.child').show()
});
});
Und meine Geige auch mit dem vollständigen Beispiel
https://jsfiddle.net/ny6qcxtd/2/
Dank!
Ihre Logik geht falsch, wenn Sie in Kindersymbol klicken. Es wird angezeigt - Zeichen anstelle von + Zeichen. Schritte zu Problem 1) klicken Sie auf Eltern-Symbol. 2) dann nach Klick auf das Kindersymbol. 3) dann nach Clik auf Eltern-Symbol, so dass alle Zeile zusammengebrochen ist. aber danach klicken Sie wieder auf das Elternsymbol, das Kindersymbol zeigt an - nicht +. Überprüfe dein Spiel. –
@LaljiNakum Danke für deine Zeit, ich wollte einige ausgefallene Tasten verwenden, aber das funktioniert perfekt für mich. – kennechu