Извлечь информацию из строки и сохранить ее в базе данных

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); 

Это, как я сериализации данных (найдено этот пример в другом потоке)

мне нужен идентификатор столбца и идентификатор строки, так что я могу сохранить их в базу данных.

Выход выглядит следующим образом: menu1 [0] = ID_2 & menu1 [1] = ID_1 & menu2 [0] = id_3 & menu2 [1] = id_4 & menu3 [0] = id_5 & menu3 [1] = id_6

Так что «menu1, menu2 ...» - это идентификаторы столбцов и id_1, id_2 - идентификаторы строк. И, конечно, мне нужно знать, куда положить <li>, и я делаю это, извлекая номер между [].

Так что мой вопрос заключается в том, как извлечь всю соответствующую информацию, о которой я упоминал, чтобы я мог отправить эту информацию в базу данных.

Answer 1

С этим будет проще работать, если вы сериализуете что-то подобное; позиция - это только индекс внутри массива элементов.

[ 
    { "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]) 
    } 
}