MVC WebGrid 仅对页面上存在的元素进行排序答案

【问题标题】：MVC WebGrid Sort only the elements present on the pageMVC WebGrid 仅对页面上存在的元素进行排序
【发布时间】：2015-12-29 06:54:28
【问题描述】：

我正在尝试制作 MVC WebGrid，我能够让网格正常工作，但面临排序问题。我将rowsPerPage 设置为 5，总共有 7 条记录。当我在第一页时，它显示前 5 条记录；当我对 Id 列进行排序时，它会对所有数据进行排序并将第 7 条记录放在顶部。

我的问题：

如何使其仅对第一页中的元素进行排序并放置第 5 条记录在上面。
如何为其创建的数据行添加样式？

代码是这样的： CSHTML -

@model IEnumerable<Product>

@{
    ViewBag.Title = "grid";
    WebGrid grid = new WebGrid(Model, rowsPerPage: 5 );
}

@grid.GetHtml(

    tableStyle: "table",
    fillEmptyRows: true,        
    headerStyle: "main-box-header clearfix",
    footerStyle: "pagination pull-right",

    mode: WebGridPagerModes.All, //paging to grid 
    firstText: "<< First",
    previousText: "< Prev",
    nextText: "Next >",
    lastText: "Last >>",

    columns: new[]  // colums in grid
    {
        grid.Column("Id"), //the model fields to display
        grid.Column("Name"  ),
        grid.Column("Description"),
        grid.Column("Quantity"),

   })

控制器 -

public ActionResult WebgridSample()
        {
            List<Product> inventoryList = new List<Product>();  

            inventoryList.Add(new Product
            {
                Id = "P101",
                Name = "Computer",
                Description = "All type of computers",
                Quantity = 800
            });
            inventoryList.Add(new Product
            {
                Id = "P102",
                Name = "Laptop",
                Description = "All models of Laptops",
                Quantity = 500
            });
            inventoryList.Add(new Product
            {
                Id = "P103",
                Name = "Camera",
                Description = "Hd  cameras",
                Quantity = 300
            });
            inventoryList.Add(new Product
            {
                Id = "P104",
                Name = "Mobile",
                Description = "All Smartphones",
                Quantity = 450
            });
            inventoryList.Add(new Product
            {
                Id = "P105",
                Name = "Notepad",
                Description = "All branded of notepads",
                Quantity = 670
            });
            inventoryList.Add(new Product
            {
                Id = "P106",
                Name = "Harddisk",
                Description = "All type of Harddisk",
                Quantity = 1200
            });
            inventoryList.Add(new Product
            {
                Id = "P107",
                Name = "PenDrive",
                Description = "All type of Pendrive",
                Quantity = 370
            });

            return View(inventoryList);

        }

【问题讨论】：

标签： asp.net-mvc-4 sorting c#-4.0 mvcgrid

【解决方案1】：

也许这不是真正的话题，但我会回答实现这个东西最有效的方法是做服务端排序：

1) 在控制器中，您将拥有 4 个新参数

public ActionResult WebgridSample(int pageNum = 1, int pageSize = 5, string sortColumnName = "",   string sortOrder = "desc")

2) 在您发出 SQL SELECT 请求后，您可以指出需要从哪个位置检索条目并进行排序（sortOrder = "" 以“按原样”获取列表）

3) 使 Bind() 方法在禁用 autoSortAndPaging 参数的情况下执行，应该指出总条目（之前的构造函数应该知道 rowsPerPage）

4) 将所需数据加载到 webgrid 后不要忘记指向页码

恭喜:)

【讨论】：