Структура DOM для массива

Question

Я работаю над «дизайнером меню» - инструментом для редактирования структуры меню в бэкенде приложения.У меня есть HTML-код, подобный этому

<ul id="menu-designer-control">
    <li id="mi-2">
        <h3>Submenu header</h3>     
        <ul>
            <li id="mi-4"><h4>Hello world - article</h4></li>

            <li><!-- Drop here --></li>
        </ul>
    </li>
    <li id="mi-1">
        <h3>Hello world - article</h3>      
        <ul>
            <li><!-- Drop here --></li>
        </ul>
    </li>

</ul>

И я хочу получить такой массив на PHP.

array(    
    2 /* top level item id */ => array( 4 /* children id */ ), 
    1 => array() /* or null or whatever */    
);

Не могли бы вы дать мне совет, как это сделать?Я пробовал .sortable ('serialize) ;, Я пытался использовать каждый (на всех li-s).Ничего с успехом - кроме того, я не очень хорошо знаком с массивами javascript: - / (Так что я совершенно не уверен, как это должно выглядеть и как отправить его на сервер… как объект / строка JSON?).

Большое спасибо

(я использую jQuery.)

Answer 1

function children(ul) {
  var lis = ul.children(), obj = {};
  lis.each(function(i, li) {
    var id = $(li).attr('id').substr(3);
    if ( id ) {
      obj[id] = children($('> ul', li));
    }
  });
  return obj;
}

var obj = children($('ul#menu-designer-control'));
console.log(obj);

Результатом будут объекты в объектах в объектах и ​​т. Д. Если существует только 2 слоя LI, объекты второго слоя всегда будут пустыми (это нормально). Хотя сборка должна быть рекурсивной: 3 слоя, 4 слоя и т. Д., Без проблем.

редактировать
Немного подправил: http://jsfiddle.net/rudiedirkx/xhLwF/

редактировать
Результат в Chrome 10:

Object
  1: Object (empty)
  2: Object >
    4: Object (empty)

редактировать
Stringified JSON результат:

{"1": {}, "2": {"4": {}}}

Answer 2

Вы должны использовать объекты, чтобы сделать это:

var dom = {
   "2":[4]
   ,
   "1":[]
};

Я не уверен, что это ответ на ваш вопрос:)