JQuery可排序函数返回空字符串答案

【问题标题】：JQuery sortable function return empty stringJQuery可排序函数返回空字符串
【发布时间】：2020-08-08 09:06:45
【问题描述】：

这里这个可排序的函数是返回空字符串

索引.cshtml

<div id="sortable" class="col-lg-9 col-md-9">
    @foreach (var chart in Model.Charts)
    {
        <div class="col-lg-4 col-md-6 hidden" id=@string.Format("chartNumber{0}", chart.ChartOrder)>
            <figure class="highcharts-figure1">
                <div id=@string.Format("container{0}", chart.ChartOrder)></div>
            </figure>
        </div>
    }
</div>

Javascript

$("#sortable").sortable({
    containment: 'parent',
    cursor: 'move',
    scroll: false,
    update: function () {
        var order = $("#sortable").sortable('serialize');
        console.log(order); // emplty string
    }
});

我希望当用户更新图表顺序时应该形成新的数组，以便我可以将此数组发送到 Post 函数，以便我可以存储图表的顺序。但是这里这个可排序的函数是返回空字符串，所以需要帮助

【问题讨论】：

嗨@MalikHaseeb，有关此案的任何更新？你试试我分享的方法吗？
是的，你的回答解决了我的问题，谢谢@FeiHan

标签： asp.net-core jquery-ui jquery-ui-sortable razor-pages

【解决方案1】：

我希望当用户更新图表顺序时应该形成新数组，以便我可以将此数组发送到 Post 函数，以便我可以存储图表的顺序。

在API documentation of Sortable plugin，我们可以找到：

默认情况下，它会以 "setname_number" 格式查看每个项目的 id，并输出一个像 "setname[]=number&setname[]=number" 这样的哈希值.

所以要达到你的要求，请修改如下代码。

将项目的Id设置为setname_number

<div class="col-lg-4 col-md-6" id=@string.Format("setname_{0}", chart.ChartOrder)>

获取新商品订单

update: function () {

    //specify `key` based on your actual requirement
    var order = $("#sortable").sortable("serialize", { key: "sort" });
    console.log(order); 
}

测试结果

【讨论】：