在ASP.NET MVC中进行排序

在上一篇文章中曾经说了一个排序，当然，那个是客户端的排序，能力有限。

但是在我的项目中却真的就需要一个排序功能，鄙人不才，能力有限，写了一堆丑陋的代码，仅实现了功能，希望路过的神们review下。

好，废话不多说，直接【插入】主题吧。（咦？这个词很好啊。）

首先早Models里创建一个实体，这里没弄数据库，凑合凑合吧，就瞎写了个实体。

代码如下：

public class UserInfo
{
public int ID { set ; get ; }
public string Name { set ; get ; }
public int Age { set ; get ; }
}

然后创建一个controller，代码如下：

public ActionResult Index()
{

return View();
}

然后是创建一个view。

由于是随便写写，所以就不在弄bll了。在controller里创建3个方法。

第一个充当数据源：

[NonAction]
private List < UserInfo > AllUsers()
{
List < UserInfo > list = new List < UserInfo > ();
list.Add( new UserInfo() {ID = 1 ,Name = " 张三 " ,Age = 18 });
list.Add( new UserInfo() { ID = 2 , Name = " 李四 " , Age = 18 });
list.Add( new UserInfo() { ID = 3 , Name = " 王五 " , Age = 17 });
list.Add( new UserInfo() { ID = 4 , Name = " 赵六 " , Age = 19 });
list.Add( new UserInfo() { ID = 5 , Name = " 田七 " , Age = 22 });
list.Add( new UserInfo() { ID = 6 , Name = " 周八 " , Age = 10 });
list.Add( new UserInfo() { ID = 7 , Name = " 吴九 " , Age = 33 });
list.Add( new UserInfo() { ID = 8 , Name = " 郑十 " , Age = 26 });
return list;
}

当然，别忘记引命名空间。

第二个和第三个是排序的重载方法，（丑陋的代码来了）

[NonAction]
private List < UserInfo > GetUsers()
{
return AllUsers();
}
[NonAction]
private List < UserInfo > GetUsers( string sort, bool ? desc)
{
List < UserInfo > list = AllUsers();
if (desc == true )
{
switch (sort)
{
case " ID " :
list = list.OrderByDescending(m => m.ID).ToList();
break ;
case " Name " :
list = list.OrderByDescending(m => m.Name).ToList();
break ;
case " Age " :
list = list.OrderByDescending(m => m.Age).ToList();
break ;
}

}
else
{
switch (sort)
{
case " ID " :
list = list.OrderBy(m => m.ID).ToList();
break ;
case " Name " :
list = list.OrderBy(m => m.Name).ToList();
break ;
case " Age " :
list = list.OrderBy(m => m.Age).ToList();
break ;
}

}
return list;
}

由于desc是bool？，所以我只会这样判断。

然后是action的代码：

public ActionResult Index( string sort, bool ? desc)
{
List < UserInfo > list ;
if (String.IsNullOrEmpty(sort) && desc != null )
{
list = GetUsers();
}
else
{
list = GetUsers(sort, desc);
}

ViewBag.sort = sort;
ViewBag.desc = ! desc;
return View(list);
}

这两个viewbag其实就是以前的viewdata，在这里需要传递到view中，充当开关。

那么我们就来看view里的代码吧，其实很简单：

< table >
< tr >
< th >
<% :Html.ActionLink( " ID " , " Index " , new {sort = " ID " ,desc = ViewBag.sort == " ID " ? ViewBag.desc: true }) %>
</ th >
< th >
<% :Html.ActionLink( " 姓名 " , " Index " , new {sort = " Name " ,desc = ViewBag.sort == " Name " ? ViewBag.desc: true }) %>
</ th >
< th >
<% :Html.ActionLink( " 年龄 " , " Index " , new {sort = " Age " ,desc = ViewBag.sort == " Age " ? ViewBag.desc: true }) %>
</ th >
</ tr >
<% foreach (MvcApplication1.Models.UserInfo info in Model)
{ %>
< tr >
< td >
<% :info.ID %>
</ td >
< td >
<% :info.Name %>
</ td >
< td >
<% :info.Age %>
</ td >
</ tr >
<% } %>
</ table >

当然，记得把view做成强类型。

这样，在点击列头的时候就实现了排序。

当然，可能有人喜欢无刷排序，或许有人会说，应该很麻烦吧。其实在ASP.NET MVC 3中，很多东西都是现成的，必须把刚才的功能做成ajax的。

首先加入js文件：

< script src = " http://www.cnblogs.com/Scripts/jquery-1.4.4-vsdoc.js " type = " text/javascript " ></ script >
< script src = " http://www.cnblogs.com/Scripts/jquery-1.4.4.min.js " type = " text/javascript " ></ script >
< script src = " http://www.cnblogs.com/Scripts/jquery.unobtrusive-ajax.js " type = " text/javascript " ></ script >

然后呢，把table做成局部view，也就是PartialView：

在PartialView中的table中，加上id，记得这个view也要强类型，就是

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<List<MvcApplication1.Models.UserInfo>>" %>

< table id = " datalist " >
< tr >
< th >
<% :Html.ActionLink( " ID " , " Index " , new {sort = " ID " ,desc = ViewBag.sort == " ID " ? ViewBag.desc: true }) %>
</ th >
< th >
<% :Html.ActionLink( " 姓名 " , " Index " , new {sort = " Name " ,desc = ViewBag.sort == " Name " ? ViewBag.desc: true }) %>
</ th >
< th >
<% :Html.ActionLink( " 年龄 " , " Index " , new {sort = " Age " ,desc = ViewBag.sort == " Age " ? ViewBag.desc: true }) %>
</ th >
</ tr >
<% foreach (MvcApplication1.Models.UserInfo info in Model)
{ %>
< tr >
< td >
<% :info.ID %>
</ td >
< td >
<% :info.Name %>
</ td >
< td >
<% :info.Age %>
</ td >
</ tr >
<% } %>
</ table >

那么，default1这个view中代码就变成：

< div >
<% :Html.Partial( " ViewUserControl1 " ,Model) %>
</ div >

下面，仅需要改链接就可以了，改成这样：

< tr >
< th >
<% :Ajax.ActionLink( " ID " , " Index " , new { sort = " ID " , desc = ViewBag.sort == " ID " ? ViewBag.desc : true }, new AjaxOptions { UpdateTargetId = " datalist " , InsertionMode = InsertionMode.Replace }) %>
</ th >
< th >
<% :Ajax.ActionLink( " 姓名 " , " Index " , new { sort = " Name " , desc = ViewBag.sort == " Name " ? ViewBag.desc : true }, new AjaxOptions { UpdateTargetId = " datalist " , InsertionMode = InsertionMode.Replace }) %>
</ th >
< th >
<% :Ajax.ActionLink( " 年龄 " , " Index " , new { sort = " Age " , desc = ViewBag.sort == " Age " ? ViewBag.desc : true }, new AjaxOptions { UpdateTargetId = " datalist " , InsertionMode = InsertionMode.Replace }) %>
</ th >
</ tr >

其中，updatetargetid是更新的内容id，这里就是这个table，第二个是替换。

这时我们运行再来看的话，就会发现现在的排序变成异步的了。怎么样，很简单吧。

转载于:https://www.cnblogs.com/fengyishou/archive/2011/04/25/2028513.html