Как получить идентификатор родительского контейнера после сортировки использования поддающийся сортировке JQuery?
У меня есть следующая разметка и JavaScript для сортировки некоторых объектов. Объекты могут быть отсортированы в блоке или через другие блоки. Это работает, но у меня есть проблема в получении корректного идентификатора блока после того, как объект перемещен от одного блока до другого.
Например, если я перемещаю объект 1 в "Блоке 1", я добираюсь, "Я нахожусь в Блоке = block_1", но если я перемещаю Объект 1 для Блокирования 2, я все еще добираюсь, я нахожусь в Блоке 1.
Но я хочу сделать блок 2 как его родительский контейнер. Я должен получить этот идентификатор так, чтобы я мог сделать некоторый ajax и обновить дб соответственно.
Можно ли помочь мне исправить это??
<div id="blocks_sortable">
<div id="block_1">
<h2>Block 1</h2>
<div class="items_sortable connectedSortable">
<div id="item_1">
<span>Item 1</span></div>
<div id="item_2">
<span>Item 2</span></div>
<div id="item_3">
<span>Item 3</span></div>
</div>
</div>
<div id="block_2">
<h2>Block 2</h2>
<div class="items_sortable connectedSortable">
<div id="item_4">
<span>Item 4</span></div>
<div id="item_5">
<span>Item 5</span></div>
<div id="item_6">
<span>Item 6</span></div>
</div>
</div>
</div>
<script>
$("#blocks_sortable").sortable({ });
$(".items_sortable").sortable({
connectWith: '.connectedSortable'
, forcePlaceholderSize: true
, stop : function(event, ui){
alert("I am in block = "+$(this).parent().attr("id"));
}
}).disableSelection();
</script>
Спасибо.
3 ответа
Я подозреваю, что проблема в том, что вы используете неправильное событие. В основном я думаю, что происходит то, что событие остановки срабатывает слишком рано или для неправильного объекта.
Я бы прочитал документацию Здесь и посмотрел, есть ли более подходящее событие для того, что вы пытаетесь сделать.
Я думаю, что вам нужно что-то вроде событий «обновить» или «деактивировать».
Оба этих события срабатывают один раз для каждого «блока», если вы перемещаете элемент из одного «блока» в другой.
Обновление сработает только один раз при перемещении внутри блока.
Деактивировать всегда срабатывает для всех блоков.
С помощью update вы можете проверить, запускается ли событие в «неоригинальном» блоке, проверив ui.sender:
$(".items_sortable").sortable({
connectWith: '.connectedSortable',
forcePlaceholderSize: true,
update: function(event, ui){
if(ui.sender){
alert(ui.item.attr("nodeName") + " in block = " +
$(this).parent().attr("id"));
}
}
}).disableSelection();
Будет предупреждать родительский идентификатор ТОЛЬКО, когда элемент перемещается в другой блок. Событие сработает для обоих блоков, но предупреждение будет отображаться только для «неоригинального».
Если вы используете AJAX для обновления информации в БД, я подозреваю, что вы хотите, чтобы событие запускалось для обоих блоков:
Один раз для «оригинала», в котором теперь отсутствует элемент, и один для « новый », который теперь получил элемент.
Я не слишком хорошо знаком с тем, что вы делаете, или с пользовательским интерфейсом jQuery, поэтому не могу сказать более конкретно. Помните, что документы - ваш друг.
Надеюсь, это поможет.
Вы можете перестраховаться и добавить атрибут REL, который будет содержать значение соответствующего родительского идентификатора. Вам нужно будет добавить код для поддержки этого атрибута REL при перемещении элементов.
может быть, лучше вместо использования атрибута id идентифицировать элементы по их индексу.
больше похоже на
alert('I am in block' + $(this).parent().index());