我正在使用以下代码来试验嵌套的jquery可排序菜单。一切正常但我确实有一个问题:如何使用序列化过程的结果来保存数据库中的菜单项?
当我移动物品时,我得到的是类似[pages] => item[]=1&item[]=7
的东西,这样我不知道哪个物品移动到另一个物品或者哪个物品变成了父物等......
我想我需要一个更详细的数组来说明菜单项的完整列表排序。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<script type='text/javascript' src='./jquery-ui-1.8.20.custom.min.js'></script>
<title>my title</title>
<style type='text/css'>
ul { min-height:10px; }
li { width: 150px; }
</style>
<script type='text/javascript'>
$(window).load(function(){
$("ul").sortable({
connectWith: "ul",
update: function(event, ui) {
$.ajax({
url: './ajax.php',
type: 'POST',
data: { pages: $('ul').sortable('serialize')},
success: function(data) {
alert(data);
}
});
}
});
});
</script>
</head>
<body>
<ul>
<li id="item_1" >Item 1</li>
<ul>
<li id="item_2" >Item 1 1<ul></ul></li>
<li id="item_3" >Item 1 2<ul></ul></li>
<li id="item_4" >Item 1 3<ul></ul></li>
</ul>
<li id="item_5" >Item 2<ul></ul></li>
<li id="item_6" >Item 3<ul></ul></li>
<li id="item_7" >Item 4<ul></ul></li>
</ul>
</body>
</html>
感谢您的时间和感谢!
./jquery-ui-1.8.20.custom.min.js
文件包含jquery本身和jquery-ui
(jquery.ui.core.js,jquery.ui.widget.js,jquery.ui.mouse.js,jquery.ui.sortable。 JS)。
./ajax.php
应负责处理序列化结果。