我有两个简单的HTML列表。第一个包含一堆条目,第二个最初为空。常见的列表结构如下:
<ul id="project-offer-list" class="connectedSortable">
<li class="ui-state-default">
<div>
<!-- formatting -->
</div>
</li>
<li class="ui-state-default">
<div>
<!-- formatting -->
</div>
用户可以通过将第一个列表中的一些条目拖动到第二个列表中来选择它们。通过这样做,他可以通过对第二个列表中的元素进行排序来给出偏好。
拖放机制由JQuery:实现
<script>
$(function() {
$("#project-offer-list, #project-selection-list").sortable({
connectWith: ".connectedSortable"
}).disableSelection();
});
</script>
我想用PHP将所选元素(第二个列表中的元素)及其顺序发送到远程服务器。每当用户单击"保存"按钮时,应发送当前选择。
我怎样才能做到这一点?我需要为每个列表元素分配一个id,并以某种方式读取第二个列表及其顺序。考虑JQuery对HTML代码可能做出的更改是至关重要的。
感谢
您需要将第二个列表的数据转换为json对象,将id分配给每个元素,使用数据库中的相同id,因为更新和执行现有数据的选项会更容易,
var items = [];
$('ul#list_id').find("li").each(function() {
var $this = $(this);
var item = { id: $(this).attr('data-id'), title: $(this).text() };
items.push(item);
});
您将得到这样的东西,并使用ajax将其发送到远程服务器
[
{"id":"1","title":"School-management"},
{"id":"2","title":"library-management"},
{"id":"3","title":"billing_software"}
]