当Ajax调用更新列表html时,jquery Ajax可排序列表停止可排序

Question

我正在使用jquery 1.4.2并尝试实现以下目标:

1 - 函数调用,它将值发送到php页面以添加/删除项目

2 - 返回项目的html列表

3 - 列表仍然可以排序

4 - 保存(序列列表)onclick

我的完整WIP位于此处[ http://www.chittak.co.uk/test4/index_nw3.php] [1 ]

我试图从UL以上的级别委派,但我无法让它工作

$("#construnctionstage").delegate('ul li', 'click', function(){

初始列表是可排序的,当你单击添加/删除时,ajax函数会返回一个包含多个项目的新列表,但是我做错了,因为当列表不再可排序时,警报消息继续有效.

$(文件).就绪(函数(){

  $('ul').delegate('li', 'click', function(){

      alert('You clicked on an li element!');
    /*$("#test-list").sortable({
      handle : '.handle',
      update : function () {
          var order = $('#test-list').sortable('serialize');
        $("#info").load("process-sortable.php?"+order);
      }
    });*/
}).sortable({
      handle : '.handle',
      update : function () {
          var order = $('#test-list').sortable('serialize');
        $("#info").load("process-sortable.php?"+order);
      }
   });

});

<div id="construnctionstage"> <ul id="test-list"> <li id="listItem_1">

Answer 1

添加/删除新元素后,您需要再次调用.sortable().在jQuery.ajax中的"success"处理程序上执行此操作.