Как сделать сортировку наборов полей, оборачивая их в элементы списка с помощью jQuery

Question

У меня есть группа элементов fieldset внутри формы. Мне нужно сделать их сортируемыми. Большинство плагинов основаны на идее сортировки списка - поэтому я пытаюсь включить набор

<fieldset>
  <input type="text" value="1" id="item_0_sort_1" name="item[0][sort]">
</fieldset>
<fieldset>
  <input type="text" value="1" id="item_0_sort_2" name="item[0][sort]">
</fieldset>
<fieldset>
  <input type="text" value="1" id="item_0_sort_3" name="item[0][sort]">
</fieldset>

в

<ul>
  <li>
    <fieldset>
      <input type = "text" value="1" id="item_0_sort_1" name="item[0][sort]">
    </fieldset>
  </li>
  <li>
    <fieldset>
      <input type = "text" value="2" id="item_0_sort_2" name="item[0][sort]">
    </fieldset>
  </li>
  <li>
    <fieldset>
      <input type = "text" value="3" id="item_0_sort_3" name="item[0][sort]">
    </fieldset>
  </li>
</ul>

(И нет, это я не могу изменить HTML :-()

Я могу обернуть наборы полей без проблем,

$('form').children('fieldset').wrap('<li>');

но, кажется, не видите, как переместить элементы набора полей в <ul>? Прямо сейчас я планирую использовать jquery.dragsort для перемещения элементов, и jQuery перенумеровывает input.val() соответственно - любые предложения для обратного вызова также будут высоко оценены.

Или я поступаю правильно? если есть способ сортировки наборов полей напрямую, я подозреваю, что было бы лучше.

Answer 1

Использование wrapAll:

$('form li').wrapAll("<ul/>");

Answer 2

Я подготовил ДЕМО .

Вот разметка:

<form>
    <fieldset>
      <input type="text" value="1" id="item_0_sort_1" name="item[0][sort]">
    </fieldset>
    <fieldset>
      <input type="text" value="1" id="item_0_sort_2" name="item[0][sort]">
    </fieldset>
    <fieldset>
      <input type="text" value="1" id="item_0_sort_3" name="item[0][sort]">
    </fieldset>
</form>

и jQuery:

$('form >*').wrap('<li>');
$('form li').wrapAll('<ul>');