Я занимаюсь разработкой приложения с пользовательским интерфейсом, который используется для отображения полей (Source => Destination).
Эти поля появятся в UL -> LI -> DIV
Списки будут создаваться динамически с помощью PHP.
Исходные поля можно перетаскивать с помощью revert: true, где поля назначения (droppable) могут принимать исходные поля. Я знаю, что принять: "#divsource"
Я могу сделать перетаскивание многих div, но моя проблема в том, как определить множество LI-> Div как сбрасываемые
В этом случае событие drop вызывает ajax, и я тоже могу его обработать.
Я новичок в jQuery, и все, что я узнал до сих пор, - это все, что я знаю. Но мои способности к быстрому обучению не проблема.
Пожалуйста, помогите с некоторым примером.
спасибо
Wikki
Ниже код - это то, с чем я играл. Я знаю, что это далеко от того, как в конечном итоге это должно выглядеть:
<script type="text/javascript">
$(document).ready(function(){
$('.srcfield').draggable({
revert: true,
helper: "clone"
});
$('#destinationfeilds').droppable({
accept : ".srcfield",
over: function(){
$(this).removeClass('out').addClass('over');
},
out: function(){
$(this).removeClass('over').addClass('out');
},
drop: function(ev, ui){
//var answer = confirm('Delete this item?');
var theTitle = $(ui.draggable).attr("title");
$(this).html("<u>"+theTitle+"</u><br/> is mapped!");
//$(this).removeClass('over').addClass('out');
//alert(theTitle);
}
});
});
</script>
</head>
<body>
<div id="destinationfeilds" class="out">
<span>Destination</span>
</div>
<div id="destinationfeilds" class="out">
<span>Destination</span>
</div>
<div id="sourcefields">
<div class="srcfield" title="First Name"><span>First Name</span></div>
<div class="srcfield" title="Last Name"><span>Last Name</span></div>
<div class="srcfield" title="Age"><span>Age</span></div>
</div>
</body>