jQuery UI сортируемый, 2 сортируемых таблицы, отключить одну, когда используется другая - PullRequest
0 голосов
/ 26 апреля 2011

У меня есть стол, который можно сортировать.Внутри каждой строки есть ссылка, которая динамически загружает другую сортируемую таблицу (она расширяет строку).У меня проблема в том, что если вы не нажмете нужную конкретную область, вы все равно можете отсортировать всю динамически отсортированную таблицу, потому что она все еще находится в сортируемой строке родительской таблицы.Я хочу отключить сортировку родительской таблицы при загрузке новой таблицы.

Итак:

<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>

превращается в следующее:

<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>   

Я пытался использовать $('.sortable').sortable('disable'); для события click, которое загружает sortable_subtable, но этопросто заканчивает тем, что отключил весь сортируемый пользовательский интерфейс.

Примечание: я не хочу ничего скрывать

в основном я хочу это:

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

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

1 Ответ

1 голос
/ 26 апреля 2011

Я проверил это со списком вместо таблиц, и это, кажется, работает. Проверьте рабочий jfiddle пример.

Это выглядит так

<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>   

И сценарий:

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

После того, как вторая строка отключит основной список, вы можете отсортировать только список подтаблиц

UPDATE Нашел пост о том, как использовать таблицы с сортируемыми.
В основном положить строки внутри <tbody class=content>
затем используйте

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