Mit jQuery (und UI) möchte ich Tabellenzeilen aus der Tabelle ziehen und sie auf ein Element ablegen können. Die Zeilen selbst sollten nicht den Tisch verlassen, ähnlich wie iTunes beim Ziehen mehrerer ausgewählter Songs funktioniert. Ich muss eine Tabelle verwenden, da dies Tabellendaten sind und ich bereits ein Tabellentyp-Plugin an Ort und Stelle habe.Zeilen in jQuery ziehen
Irgendeine Idee, wie man das erreicht?
Mit drupable() von JQuery UI können Sie eine Funktion definieren, die ausgeführt wird, wenn ein akzeptables ziehbares() Objekt auf dieses Ablagefeld() abgelegt wird. Die Demo auf this page hat mir geholfen zu verstehen, wie man es programmiert. Sehen Sie sich ihren Code an, indem Sie auf "Quelle anzeigen" klicken. Gerade dieser Teil:
$gallery.droppable({
accept: '#trash li',
activeClass: 'custom-state-active',
drop: function(ev, ui) {
recycleImage(ui.draggable);
}
});
sollten Sie in der Lage sein, eine Drop-Funktion zu erstellen, um die Zeile, die Sie klonen möchten, zum Beispiel, aber nicht löschen Sie es aus seiner ursprünglichen Position.
Ja, das ist nicht der problematische Aspekt. Es kann nicht dazu führen, dass eine Tabellenzeile außerhalb des Tisches verschoben werden kann. – mikeycgto
Probieren Sie dieses Plugin, geschrieben in Javascript, in der Lage, Zeilen und Spalten zu ziehen und zu sortieren. https://sindu12jun.github.io/table-dragger/
gibt es jQuery-Plugin, um dies zu erreichen. Siehe http://www.isocra.com/2008/02/table-drag-and-drop-jquery-plugin/ – mikeycgto
Ich weiß, das ist ein alter Beitrag, aber dennoch funktioniert das tnd-Tabellen-Plugin nicht in einer Tabelle mit ein thead und tbody, die Kopfzeile ignorieren wollen. Mehrere Leute haben eine verzweigte Version geschrieben. Eine Version, die in den Kommentaren des von Ihnen verlinkten tnd verlinkt ist, arbeitet mit einer korrekt formatierten Tabelle. Einziger Nachteil ist, dass es alle meine Dropdowns deaktiviert. Wenn Sie keine Kontrolle über Ihren Tisch haben, scheint die verzweigte Version "http: // riouxsvn.com/svn/jquery-tablendd/trunk /" gut zu funktionieren. Das Projekt ist jetzt auch auf GitHub hier "https: // github.com/isocra/TableDnD /" aber es ist auch nicht auf dem neuesten Stand. – Nope