JQuery 可排序函数 return 空字符串

Question

这里这个排序函数是return空字符串

Index.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 函数，以便我可以存储图表的顺序。但是这里这个可排序函数是return空字符串，所以需要帮助

Answer 1

I want that when user update the charts order then new array should be formed so that I can send this array to the Post function so that I can store the sequence of the charts.

在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); 
}

测试结果

JQuery 可排序函数 return 空字符串

JQuery sortable function return empty string

asp.net-core

jquery-ui

jquery-ui-sortable

razor-pages