asp.net-core - JQuery可排序函数返回空字符串

Question

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

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

标签： asp.net-corejquery-uijquery-ui-sortablerazor-pages

Answer 1

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

在Sortable 插件的 API 文档中，我们可以找到：

默认情况下，它通过以“ 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); 
}

测试结果