我想動態創建一個列表,並使其排序。jQuery UI的可排序的序列化列出故障
我在第一次嘗試沒有包括列表數據的動態加載。我發現了一個基本的例子,在這裏建於:
http://www.webresourcesdepot.com/wp-content/uploads/file/jquerydragdrop/
當「列表」中選擇元素改變我檢索選擇檢索與選擇的列表相關聯的任務的整數值。
這是我到目前爲止。在Firebug中,加載後列表的結構正確。我認爲這個問題是我在getJSON調用中創建列表後,使列表「可排序」的地方。
我已經試過移動「//設置我們listdiv UL中的排序和東西」的JSON調用內部和外部,但仍選擇onChange事件中的代碼。
顯示列表中,但不可排序。沒有錯誤。困惑。 :0
$(document).ready(function(){
// our global buildlist var
var buildlist;
$('#lists').change(function(){
var selected = $("#lists option:selected");
var listval = selected.val();
buildlist = "<ul>";
$.getJSON('getlist.php?cid='+listval, function(data) {
for(var i =0;i<data.length;i++)
{
var item = data[i];
// alert(item.id+","+item.cid+","+item.task+","+item.position);
buildlist = buildlist + "<li id='listtasks_"+item.id+"'>"+item.task+"</li>";
}
buildlist = buildlist + "</ul>";
$("#listdiv").html(buildlist);
}); // end getJSON
// set our listdiv ul as sortable and stuff
$("#listdiv ul").sortable({ opacity: 0.6, cursor: 'move', update: function(){
var order = $(this).sortable("serialize") + '&action=update';
$.post("updatelist.php", order, function(){
});
}
});
}); // end of change lists select box
}); // end doc ready
,這是加載列表
<div id="listdiv">
<ul>
<li id="listtasks_1">this is item 1</li>
<li id="listtasks_2">this is item 2</li>
<li id="listtasks_3">this is item 3</li>
<li id="listtasks_4">this is item 4</li>
<li id="listtasks_5">this is itme 5 </li>
</ul>
</div>
謝謝,現在都很好。我只是在某些時候迷惑自己。大衛赫德倫讓我平靜下來,回到正軌。 :) – Steve 2011-12-14 19:24:52