Question

我有多个列<ul>，可以通过jQuery UI进行排序。要在<li>内保存<ul>的位置，我需要序列化数据。

$(function() {
 $("ul.sortable").sortable({
    connectWith: '.sortable',
    update: function(event, ui) {
   /* var position = $('.sortable').sortable('serialize', {
            key: 'menu',
            connected: true
        });*/
    $('div').empty().html( $('.sortable').serial() );
    }
  });
});


(function($) {
$.fn.serial = function() {
 var array = [];
 var $elem = $(this); 
    $elem.each(function(i) {
      var menu = this.id;
        $('li', this).each(function(e) {
                array.push( menu + '['+e+']=' + this.id  );
        });
    });
    return array.join('&');      
    }

})(jQuery);

这就是我如何序列化数据（在另一个线程上找到这个例子）

我需要列的id和行的id，所以我可以将它们保存到数据库。

输出如下所示：menu1 [0] = id_2＆amp; menu1 [1] = id_1＆amp; menu2 [0] = id_3＆amp; menu2 [1] = id_4＆amp; menu3 [0] = id_5＆amp; menu3 [1] = id_6 < / p>

所以'menu1，menu2 ...'是列ID和id_1，id_2是行ID。当然，我需要知道放置<li>的位置，我通过在[]之间提取数字来做到这一点。

所以我的问题是如何提取我提到的所有相关信息，以便将这些信息发送到数据库。

Answer 1

如果你序列化为这样的东西，它会更容易使用;该位置只是items数组中的索引。

[ 
  { "column" : "menu1", "items" : [ "id_2", "id_1" ] },
  { "column" : "menu2", "items" : [ "id_3", "id_4" ] },
  { "column" : "menu3", "items" : [ "id_5", "id_6" ] }
]

您可以像这样创建：

(function($) {
    $.fn.serial = function() {
        var menus = [];
        var $elem = $(this); 
        $elem.each(function(i) {
            var menu = this.id;
            var items = [];
            $('li', this).each(function(e) {
                items.push( this.id  );
            });
            menus.push({ "column" : menu, "items": items });
        });
        return menus;
    }
})(jQuery);

并像这样迭代：

for (var m = 0; m < menus.length; m++) {
    var menu = menus[m];
    var column = menu["column"];
    var items = menu["items"];
    for (var i = 0; i < items.length; i++) {
        update(i, column, items[i])
    }
}

从字符串中提取信息并将其保存到数据库

1 个答案: