ASP.NET MVC 3使用升序,降序选项自定义WebGrid

时间:2012-04-04 15:36:46

标签: c# asp.net-mvc-3 sorting webgrid

直升机, 我正在开发ASP.NET MVC 3应用程序。

我有一个视图

var grid = new WebGrid(rowsPerPage: 10, ajaxUpdateContainerId: "GridDiv",canPage: true,canSort: true);
grid.Bind(source: Model);
grid.Pager(WebGridPagerModes.All);
@grid.GetHtml(htmlAttributes: new { id="grid" },
    columns: grid.Columns(
    grid.Column("Name"),
    grid.Column("Age"),
    grid.Column("Sex")
)

在控制器中,我有一个自定义排序算法来对数据进行排序。 我有自定义升序排序和自定义降序排序。

我希望当用户点击列标题以按照我的自定义排序算法排序行而不是在一个排序算法中排序。

为此,我尝试了以下(我接受“sortdir”并相应地处理它)

控制器

public ActionResult Persons(string sortdir)
{    
    PersonsListModel = GetAllPersonsList();
    if(sortdir=="ASC")
        return View(MyAscendingCustomSortAlgorithm(PersonsListModel ));
    else
        return View(MyDescendingCustomSortAlgorithm(PersonsListModel ));
}

MyAscendingCustomSortAlgorithmMyDescendingCustomSortAlgorithm是返回按我的自定义算法排序的列表的函数。

当页面加载时,列表被正确排序,但是当我点击标题时,排序就搞砸了。我调试了,一切都运行正常。

我的问题是如何才能完成这项工作,并保持正确的分页

我还尝试设置canSort: false,但之后我再也无法点击标题了。

非常感谢您的帮助

3 个答案:

答案 0 :(得分:2)

您是否尝试过关闭Bind()方法中的autoSortAndPage参数?

grid.Bind(source: Model, autoSortAndPage : false);

我知道您想保留现有的分页,但我不确定是否有办法同时使用这两种分页。您可能需要在操作方法中手动执行分页。

答案 1 :(得分:1)

你应该这样搜索:

  1. 禁用排序
  2. 向列标题添加自定义样式(.GetHtml html属性中的“headerStyle:customStyle”)。查看章节Styling your grid
  3. 使用jquery为具有此样式的所有元素添加实时单击处理程序,并在用户单击时检查它是哪个列并相应地发布到将刷新页面的控制器
  4. 此外,您可以在css中添加一些链接到customStype的样式,即“cursor:hand”,以便用户看到标题是可点击的。

答案 2 :(得分:1)

我会在方法的参数中添加页码,行数,排序列和排序方向。它也应该只返回json数据。您应该在javascript中处理该数据以更新您的视图。

您可以将自己的排序css类添加到标头并链接到ajax操作。可以在javascript中处理您的网格,只需更改数据行。

public JsonResult Persons(int pagenumber,int rows, string sortcol, string sortdir)
{    

if(sortdir=="ASC")
    return DataSource(pagenumber,rows,sortcol,MyAscendingCustomSortAlgorithm);
else
    return DataSource(pagenumber,rows,sortcol,MyDescendingCustomSortAlgorithm);

}

您可以将排序函数传递给数据源调用并使用它来返回json数据。您可以使用linq查询行