Макет конечно набрасал, только вот такие вопросы:
1) как передать это потом в php, то есть то что мы поставили в #sortable
нужно записать в базу данных, при нажатии кнопки, ладно, всё бы ничего. НО, куда записать позиции и как?
и как это всё вообще связать с php?
что бы данные с каждого объекта которые я перетащил в поле, использовались в php.
Нужно что ли скрытые input cоздать? и в них уже записывать позиции, и данные об элементе? но всё же, как их потом достать в php в нужном порядке, и как определить где закончился один блок, а где начался второй...
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="/js/jquery-ui-1.9.2.custom.js"></script>
<link type="text/css" href="css/custom-theme/jquery-ui-1.9.2.custom.css" rel="stylesheet" />
<style>
body{padding:15px;}
ul { list-style-type: none; margin: 0; padding: 0; margin-bottom: 10px; }
li { margin: 5px; padding: 5px; width: 150px; }
#sortable{ min-height: 200px;
width:250px;
background: #e6e6e6 url(/css/custom-theme/images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x;}
</style>
<script>
$(function() {
$( "#accordion" ).accordion({
header: " > div > h3 > input"
});
$( "#sortable" ).sortable({
revert: true
});
$( "#draggable li" ).draggable({
connectToSortable: "#sortable",
helper: "clone",
revert: "invalid"
});
$( "ul, li" ).disableSelection();
});
</script>
</head>
<body>
<ul id="draggable">
<li id='aaccordion' class="ui-state-default">
<h3>Section 1</h3>
<div>
<input type="text" name="name"/>
</div></li>
<li id='aaccordion' class="ui-state-default"><h3>Section 1</h3>
<div>
<input type="text" name="name2"/>
</div></li></li>
</ul>
<form method="post">
<ul id="sortable">
<li id='aaccordion' class="ui-state-default">Уже готовый модуль</li>
</ul>
<input type="submit" name="go" value='Go'/>
</form>
<?php
if(isset($_POST['go'])){
echo $_POST['name'];
}
?>
</body>
</html>
2) Вот поставил я объект в #sortable. Но он мне стал не нужен, как сделать что бы его можно было удалить, то есть вывожу я его за пределы поля, и он удаляется, либо просто возвращается на своё место, с колонки выбора. Пример - когда беру #draggbatle li, и отпускаю его за пределами поля, он возвращается туда, где я его взял.
но он стал дочерним в #sortable, а значит нужно что бы при нажатии на обьект, он становился дочерним для #draggbatle. Верно?? но как?
3) попытался aaccordion ещё поставить, но не работает если его на <li> ставлю
в чём проблема может бытЬ? правильно отстроить нужно?