Sortierbar - Beschränken Sie das Ziehen nur auf das übergeordnete Element <li>? - Jquery-Ui

Ich benutze die sortierbare Demo in jquery-ui. Ich versuche, der sortierbaren Liste zur Laufzeit ein Element hinzuzufügen, z. B .:

<ul id="panelSortable">
</ul>

$("#panelSortable").sortable({
distance: "15"
});

function generatePanel() {
var html = "<li>";
html += "<p>hello!</p>";
html += "</li>";
return html;
}

function addPanel() {
var element = $(generatePanel());
element.appendTo("#panelSortable");
element.sortable();
element.disableSelection();
}

Das neue Element wird der sortierbaren Liste hinzugefügtOK. Ich kann das "p" -Element jedoch seltsamerweise separat vom übergeordneten "li" -Element (das auch ziehbar ist) ziehen. Ich möchte das Ziehen auf das "li" -Element beschränken.

Wenn ich nur ein paar "li" -Elemente auf der Seite deklariere, funktionieren sie alle auf die normale Weise, wobei Sie nur die "li" -Elemente ziehen können, nicht das untergeordnete "p":

<ul id="panelSortable">
<li><p>I work normally!</p></li>
</ul>

Also muss ich die Aufrufe hier durcheinander bringen, um die "p" -Elemente auch ziehbar zu machen?

Vielen Dank

Antworten:

Okay, Sie müssen sortable () nicht anrufenElement, das nur für das übergeordnete "ul" -Element ausgeführt werden soll, wie es aussieht. Wenn Sie das entfernen und das Element wie oben gezeigt hinzufügen, wird die Sortierung für dieses Element aktiviert.

Vielen Dank