我怎样才能做一个排序复选框列表与数组

订购我有这样的html代码：我怎样才能做一个排序复选框列表与数组

<div id="format"> 
<ul id="sortable"> 
<li id="item1"> 
     <input class="checkbox" id="item1" name="params[checklist][]" value="item1" checked="checked" type="checkbox"> 
     <label for="item1">Item 1</label> 
</li> 
<li id="item2"> 
     <input class="checkbox" id="item2" name="params[checklist][]" value="item2" checked="checked" type="checkbox"> 
     <label for="item2">Item 2</label> 
</li> 
<li id="item3"> 
     <input class="checkbox" id="item3" name="params[checklist][]" value="item3" checked="checked" type="checkbox"> 
     <label for="item3">Item 3</label> 
     </li> 
</ul> 
</div> 
<input name="params[positions]" id="paramspositions" value="item2,item3,item1" class="text_area" size="50" type="text" />

和这个jQuery/UI代码：

jQuery.noConflict(); 
//function that restores the list order from #paramspositions default value 
function restoreOrder() { 
    var list = jQuery("#format ul"); 
    if (list == null) return 

    var old = jQuery("#paramspositions").val(); 
    // make array from saved order 
    var IDs = old.split(","); 

    // fetch current order 
    var items = list.sortable("toArray"); 

    // make array from current order 
    var rebuild = new Array(); 
    for (var v = 0, len = items.length; v < len; v++) { 
     rebuild[items[v]] = items[v]; 
    } 

    for (var i = 0, n = IDs.length; i < n; i++) { 

     // item id from saved order 
     var itemID = IDs[i]; 

     if (itemID in rebuild) { 

      // select item id from current order 
      var item = rebuild[itemID]; 

      // select the item according to current order 
      var child = jQuery("ul.ui-sortable").children("#" + item); 

      // select the item according to the saved order 
      var savedOrd = jQuery("ul.ui-sortable").children("#" + itemID); 

      // remove all the items 
      child.remove(); 

      // add the items in turn according to saved order 
      // we need to filter here since the "ui-sortable" 
      // class is applied to all ul elements and we 
      // only want the very first! You can modify this 
      // to support multiple lists - not tested! 
      jQuery("ul.ui-sortable").filter(":first").append(savedOrd); 
     } 
    } 
} 

jQuery(function() { 

    jQuery("#sortable").sortable({ 
     opacity: 0.6, 
     update: function(event, ui) { 
      aggiornaTesto(); 
     } 
    }); 

    //function that updates #paramspositions value on check/uncheck and on moving checkbox 
    function aggiornaTesto() { 
     ids = []; 
     jQuery("input:checkbox:checked").each(function(n) { 
      ids.push(jQuery(this).attr("value")); 
     }); 
     jQuery("#paramspositions").val(ids); 
    } 

    // here, we reload the saved order 
    restoreOrder(); 
    jQuery(".checkbox").button(); 
    jQuery("#sortable input").click(aggiornaTesto); 
}); // JavaScript Document

这是我的问题：

在这种情况下，所有作品除了更新输入值检查/取消选中
如果我删除标签上的标签标签除了restoreOrder之外的所有作品加载

如何使这项工作？基本上我需要一个可排序的复选框列表，在加载页面的列表顺序依赖于一个数组，并在检查/取消选中和移动项目更新输入值。非常感谢你，对我的英语感到抱歉。

来源

2011-07-25 Serafino Bilotta

我找到了解决方案。问题是，李和输入有相同的ID，如果我在每一个立ID只添加下划线像这样：

<li id="item1_"> 
... 
<li id="item3_">

后，我已经编辑在restoreOrder这一行（）jQuery函数：

var itemID = IDs[i];

与此：

var itemID = IDs[i]+"_";

，但只有一个问题，现在，如果在#paramspositions看重那里是只有2例如价值，我怎么可以把上面这2个值，和其他人底部？

来源

2011-07-26 00:18:18

我怎样才能做一个排序复选框列表与数组

回答

相关问题