JS/Jquery填充数组，然后通过AJAX发送

我使用jqueryui的sortable，通过将每个元素拖动到所需的顺序，对列表进行排序

我正在将项目的

id

存储在

li

id

属性中（我知道这是无效的），并将元素的

顺序

存储在

rel

属性中

例如：

<li id="23" rel="1">First</li>
<li id="20" rel="2">Second</li>
<li id="24" rel="3">Third</li>

以下是我迄今为止的代码：

$('#submit').click(function(e) {
   e.preventDefault();

   //array
   var the_data = [];

   $('#sortable li').each(function() {

        the_data[$(this).attr('id')] = $(this).attr('rel');

   });

   console.log(the_data);         
});

我在FireBug中得到了很多次未定义的

，但是如果我扩展它，所有的值都在那里，有人能解释一下是什么错误吗？至少对我来说是有道理的

向AJAX发送数据数组的最佳方式是什么？我读过关于Jquery的
.param（）
和
序列化

这方面有什么最佳实践吗

我的ajax：

myData=Jquery.param(the_data); //serialize the array?
$.ajax({
                type: "POST",
                url: "<?php echo base_url(); ?>admin/update_order/",
                data: myData,
                success: function(msg) {
                alert('Updated'); 
                },
                error: function(msg) {
                  alert(msg);       
                }
});

myData=Jquery.param（_数据）//序列化数组？
$.ajax({
类型：“POST”，
url:“管理员/更新订单/”，
数据：myData，
成功：功能（msg）{
警报（“更新”）；
},
错误：函数（msg）{
警报（msg）；
}
});

谢谢。
我不会自己写代码的。只需使用jQuery UI Sortable中的继承功能

绑定一个stop事件函数并使用.sortable（'serialize'）以一种易于通过Ajax传递的格式以新的顺序获取列表

我不会自己写代码。只需使用jQuery UI Sortable中的继承功能

绑定一个stop事件函数并使用.sortable（'serialize'）以一种易于通过Ajax传递的格式以新的顺序获取列表

如果您查看jQueryUI的可排序文档，它显示了两种方法，用于获取用于您目的的ID数组。我会特别关注这个方法，因为它更接近你想要的。特别是如果您可以放弃rel属性，而只移动到带下划线的id。
如果您查看jQuery UI的可排序文档，它显示了两种方法来获取id数组。我会特别关注这个方法，因为它更接近你想要的。特别是如果您可以放弃rel属性而只移动到带下划线的id。
请按照此链接正确操作jquery sortable for ajax内容并绑定到更新函数请参见此

Javascript

$(function () {
$( '.contentLeft' ).sortable({ opacity: 0.6, cursor: 'move', update: function() {
$("#log").html('update called');   }
});  });



$("#search").click(function() {
               loadDrop();               
           });

function loadDrop()
        {$.ajax({
                url:'/echo/html',
                success:function(){ 
                $("#trig").html('<div><ul id="sortable" class="contentLeft"><li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 2</li><li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 3</li></div>');
                test();
$(".contentLeft").sortable({opacity: 0.6, cursor: 'move'});

                }
            });
        }
function test(){
$( '.contentLeft' ).sortable({ opacity: 0.6, cursor: 'move', 
update: function() {
 $("#log2").html('update called via ajax');
}});
}

$（函数（）{
$（'.contentLeft'）.sortable（{opacity:0.6，游标：'move'，update:function（）{
$（“#log”）.html（'update called'）；}
});  });
$（“#搜索”）。单击（函数（）{
loadDrop（）；
});
函数loadDrop（）
{.ajax({
url:“/echo/html”，
成功：函数（）{
$（“#trig”）.html（“
第2项
第3项
”）；
test（）；
$（“.contentLeft”）.sortable（{opacity:0.6，光标：'move'}）；
}
});
}
功能测试（）{
$（'.contentLeft'）。可排序（{opacity:0.6，光标：'move'，
更新：函数（）{
$（“#log2”）.html（'通过ajax调用更新'）；
}});
}
请按照此链接正确操作jquery sortable for ajax内容并绑定到更新函数参见此

Javascript

$(function () {
$( '.contentLeft' ).sortable({ opacity: 0.6, cursor: 'move', update: function() {
$("#log").html('update called');   }
});  });



$("#search").click(function() {
               loadDrop();               
           });

function loadDrop()
        {$.ajax({
                url:'/echo/html',
                success:function(){ 
                $("#trig").html('<div><ul id="sortable" class="contentLeft"><li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 2</li><li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 3</li></div>');
                test();
$(".contentLeft").sortable({opacity: 0.6, cursor: 'move'});

                }
            });
        }
function test(){
$( '.contentLeft' ).sortable({ opacity: 0.6, cursor: 'move', 
update: function() {
 $("#log2").html('update called via ajax');
}});
}

$（函数（）{
$（'.contentLeft'）.sortable（{opacity:0.6，游标：'move'，update:function（）{
$（“#log”）.html（'update called'）；}
});  });
$（“#搜索”）。单击（函数（）{
loadDrop（）；
});
函数loadDrop（）
{.ajax({
url:“/echo/html”，
成功：函数（）{
$（“#trig”）.html（“
第2项
第3项
”）；
test（）；
$（“.contentLeft”）.sortable（{opacity:0.6，光标：'move'}）；
}
});
}
功能测试（）{
$（'.contentLeft'）。可排序（{opacity:0.6，光标：'move'，
更新：函数（）{
$（“#log2”）.html（'通过ajax调用更新'）；
}});
}