jQuery UI 可排序序列化或 toarray 方法 - 需要建议

Question

我一直在看

http://jqueryui.com/demos/sortable/#default

一天的大部分时间。我想用新值更新数据库是大多数人想要的。当我使用 ASP.NET 时，我的想法是使用序列化将新值发送到更新数据库的页面。这是脚本:

<script type="text/javascript">
    jQuery(function() {
    $("#sortable").sortable();
    $("#sortable").disableSelection();
    });
    jQuery(function() {
    $("#sortable li:lt(3)").css("font-weight", "bold");
    });
    jQuery(function() {
    $("#cmdUpdateSortOrder").click(function() {
            $(".neworder").append("<br />");
            $("#sortable li.ui-state-default").each(function() {
                $(".neworder").append($(this).text() + "<br />");
            });
            var str = $("#sortable li.ui-state-default").sortable("serialize");
            alert(str);
            var result = $('#sortable li').sortable('toArray');
            alert(result);
        });
    });
</script>

第一个函数取自 jQueryUI 示例， 第二个函数突出显示前三行， 单击按钮后，第三个函数将新订单写入页面。 这两个警报都给了我:

[object Object]

我希望有一个 id 和值对，比如 0=3&1=2&2=4 等。此外，如果有人有更好的方法来做到这一点，(ajax？)，我将不胜感激。

Answer 1

以下是我如何解析可排序以通过 jquery ajax 发布到 ASP.net MVC Controller 操作。

parseRouteRoleIds() 可能就是您所追求的。我只是在每个 sortable() div 上有一个带有 rowId 类的隐藏跨度。当我渲染页面的该部分时，我只需将相关的项目键放入范围中。稍后，当用户准备保存更改时，我只需在 parseRouteRoleIds() 函数中连接 Id 列表即可。

$.ajax({
  type: 'POST',
  data: 'reviewCycleSwitchId=' + SWID + '&reviewCycleRoleIdList=' + parseRouteRoleIds(), 
  url:  root + saveRoutesPath,
  success: function(result) { // something you would do on success }
});

function parseRouteRoleIds() {
    var kys = '';
    $('.usedTiles li').each(function() {
        kys = kys + ',' + $('.rowId', $(this)).html();
    });
    return kys;
}