调整Shield UI Grid列序列

Question

经过一些研究后，我似乎无法解决Shield UI网格控件的问题。我希望能够允许用户按照他们选择的顺序放置列。我有类似的命令，如下面的代码：

$(function () {
    $("#grid").shieldGrid({
        dataSource: {
            data: products
        },
        columns: [
            "ProductName",
            { field: "['Category']['CategoryName']", title: "CategoryName", format: "{0:c}", width: "330px" },
            { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "130px" },
            { field: "UnitsInStock", title: "Units In Stock", width: "130px" },
            { field: "Discontinued", width: "130px" }
        ]
    });
});

在我找不到解决方案之后，我在页面上放置了一些额外的控件以显示列序列，但这并不像我想要的那样。 有没有办法动态更改网格列的位置？

Answer 1

事实上，解决方案非常简单。 Shield UI网格控件支持动态列重新排序。 您只需要在代码中包含columnReorder属性设置为true：

columnReorder: true,

除此之外，无需使用其他控件。使用拖放用户只需拖动列并将其放置在所需位置即可。