Сортировка JQuery UI / перетаскиваемый клон не работает - PullRequest
Новая
       15

Сортировка JQuery UI / перетаскиваемый клон не работает

0 голосов
/ 01 декабря 2010

Привет, ребята, я использую пользовательский интерфейс для некоторого перетаскивания, проблема в том, что я не могу заставить "клона" сработать.

У меня есть 2 <ul><li></li></ul> списков, и я хочу перетащить из списка 1 в список 2. Хорошо, этот бит прост, но получить «клон», чтобы остаться в первом списке, нет. То, что мне нужно / нужно сделать, это перетаскивание из списка 1 в список 2 (только одностороннее перетаскивание), затем при получении в списке 2 скрыть удалить перетаскиваемый элемент - ОК звучит странно, но идентификатор перетаскиваемого элемента загружает страницу на основе этого Идентификатор в созданный "пусто" <li> во 2-й <ul>

Пока "мы" выглядят примерно так: 

 $('ul#inputs_menu li ul').sortable({

connectWith: "ul#layout_form",

}).disableSelection();

$('ul#inputs_menu li ul li').sortable({

helper: "clone"

}).disableSelection();


$(' ul#layout_form' ).sortable({

receive: function(event, ui) {

var new_item = (ui.item).attr('id');

$('ul#layout_form').append('<li><div id="'+new_item.substr(4)+'"class="'+new_item.substr(4)+' inputs radius_10" ></div></li>');

$('#'+new_item.substr(4)).load('includes/text.php?fld_name='+new_item.substr(4));

}

}).disableSelection();

Предложения, пожалуйста - спасибо

1 Ответ

1 голос
/ 01 декабря 2010

Вместо ui.item, который является оригиналом, вы хотите ui.helper здесь, который является клоном.Кроме того, вы можете сократить общую работу кода и селектора, используя вместо этого .appendTo(), например: 

$('#inputs_menu li ul').sortable({
  connectWith: "ul#layout_form",
}).disableSelection();
$('#inputs_menu li ul li').sortable({
  helper: "clone"
}).disableSelection();

$('#layout_form' ).sortable({
  receive: function(event, ui) {
    var new_item = ui.helper.id.substr(4);
    $('<li><div id="'+new_item+'"class="'+new_item+' inputs radius_10" ></div></li>')
      .appendTo('#layout_form')
      .find("div").load('includes/text.php?fld_name='+new_item);            
  }
}).disableSelection();
...