родитель может сделать все дочерние объекты перетаскиваемыми, и когда ребенок нажимается, они перетаскиваемы и сортируемы

Question

родитель может сделать все дочерние объекты перетаскиваемыми, и когда ребенок нажимается, они перетаскиваемы и сортируемы

0

Я хочу, чтобы перетаскивать все дочерние элементы, если щелкнул родительский элемент, т.е. При нажатии на родителя, попробуйте перетащить все его дочерние элементы, также если я нажму на дочерний элемент, тогда только его элементы должны быть перетаскиваемы.

Я использую ниже код, но он работает только для дочерних элементов, и когда я пытаюсь перетащить все дочерние элементы из родителя, это можно сделать

$(function () {
   $(".droppable>div").sortable({
      connectWith: ".connectedSortable>div",
   }).disableSelection();        
});

<div name="list-a" class="droppable connectedSortable"> <h3>List A</h3>
   <div class="task - wrapper" id="child">
      <div class="draggable" id="1" name="1"> <a href="#">Element 1</a></div>
      <div class="draggable" id="2" name="3"> <a href="#">Element 2</a></div>
      <div class="draggable" id="3" name="3"> <a href="#">Element 3</a></div>
   </div>
</div>

Список A
Элемент 1
Элемент 2
Элемент 3

Могут перетащить, так же как и Элемент 1,2 и 3, но когда я попытался перетащить весь список A вместе со своим потомком, тогда не могу этого сделать. пожалуйста помоги.

РЕДАКТИРОВАТЬ:
Демо-версия JsFiddle

user3386790 02 май 2014, в 08:58

Источник

1

Можете ли вы предоставить демо на jsfiddle?
Irvin Dominin 02 май 2014, в 06:47
0

Пожалуйста, проверьте ссылку JS Fiddle
user3386790 02 май 2014, в 06:56

Теги:

javascript

jquery

jquery-ui

1 ответ

Ещё вопросы

Можете ли вы предоставить демо на jsfiddle?
Пожалуйста, проверьте ссылку JS Fiddle

Daniel Paul · Answer 1 · 2014-05-02T04-13-00.000Z

Посмотрите документацию https://jqueryui.com/sortable/. В ней конкретно говорится, что она заставляет дочерние элементы div перетаскивать, а не сам div. Если вы хотите перетащить #child, вам нужно изменить

$(".droppable>div").sortable().disableSelection();

в

$(".droppable>div").sortable().disableSelection();
$(".droppable>div").draggable();

или

$(".droppable>div").sortable().disableSelection();
$(".droppable").sortable().disableSelection();

в зависимости от того, что вы пытаетесь сделать. Вы также добавили connectWith: ". ConnectedSortable> div", но это не имеет смысла с текущей разметкой, так как это тот же div.

хорошо, спасибо @ Daniel.Так как я могу улучшить структуру так, чтобы родительский элемент мог перетаскивать весь свой дочерний элемент, а его дочерние элементы оставались перетаскиваемыми и сортируемыми
вот ссылка, где я делаю решение и его работу ( jsfiddle.net/88amrit/bpGRL )