jQuery ui triable, 2 tables triables, désactivez-en une autre - jquery, jquery-ui, jquery-ui-sortable

J'ai une table qui peut être triée. Chaque ligne contient un lien qui charge dynamiquement une autre table pouvant être triée (elle développe la ligne). Le problème que j’ai, c’est que si vous ne cliquez pas dans la zone spécifique droite, vous pouvez toujours trier toute la table triée dynamiquement car elle se trouve toujours dans la ligne pouvant être triée de la table parente. Ce que je veux faire, c'est désactiver le triable sur la table parente lorsque la nouvelle table est chargée.

Donc ça:

<table class="sortable">
<tr><td><a class="load" href="#">load content</a></td></tr>
<tr><td><a class="load" href="#">load content</a></td></tr>
</table>

se transforme en ceci:

<table class="sortable">
<tr><td>
<table class="sortable_subtable">
<tr><td>loaded content row 1</td><tr>
<tr><td>loaded content row 2</td><tr>
</table>
</td></tr>
<tr><td><a class="load" href="#">load content</a></td></tr>
</table>

J'ai "essayé d'utiliser $(".sortable").sortable("disable"); sur l'événement click qui charge la table_table, mais finit par désactiver l'interface utilisateur entière.

Note: je ne veux rien cacher

fondamentalement, je veux ceci:

$(".sortable, .sortable_subtable").sortable();

$(".load").click(function(e){
//disable sortable on ".sortable" only
//loads dynamic content into table row, expanding row
});

Réponses:

1 pour la réponse № 1

J'ai testé cela avec la liste au lieu de tableaux et cela semble fonctionner. Vérifier le fonctionnement jfiddle Exemple.

Ça ressemble à ça

<ul class="sortable">
<li><a class="load" href="#">load content 1</a></li>
<li>
<ul class="sortable_subtable">
<li><a class="load" href="#">loaded content row 1</a>
<li><a class="load" href="#">loaded content row 2</a></li>
</ul>
</li>
<li><a class="load" href="#">load content 3</a></li>
</ul>

Et le script:

$(".sortable, .sortable_subtable").sortable();
$(".sortable").sortable("disable");

Après la deuxième ligne désactive la liste principale, vous pouvez trier uniquement la liste de sous-tableau

METTRE À JOUR Trouvé un poster sur la façon d'utiliser des tables avec triable.
Mettre les lignes à l'intérieur <tbody class=content>
puis utiliser

$("#tableId tbody.content").sortable();

---