重构MVC多条件+分页解决方案

为支持MVC的验证，无刷新查询，EF，以及让代码可读性更强一点，所以就重构了下原来的解决方案。

这里就简单讲下使用方法吧：

Model：

继承PagerBase：

 1 public class SearchModel : PagerBase
 2     {
 3         public SearchModel()
 4         {
 5             AddFields("UserName", "Age", "Sex");
 6         }
 7
 8         [Required(ErrorMessage = "需要输入 用户名")]
 9         public string UserName { get; set; }
10         public string Age { get; set; }
11         public string Sex { get; set; }
12
13         public IQueryable<Member> Members { get; set; }
14
15         public override void Search()
16         {
17             int age = 0;
18             if(!Int32.TryParse(Age, out age)) Age = string.Empty;
19             // 过滤
20             Members = Members.Where(UserName, entity => entity.UserName.Contains(UserName))
21                 .Where(Age, entity => entity.Age == age)
22                 .Where(Sex, entity => entity.Sex == Sex.Trim());
23             // 分页
24             Members = Pager(Members.OrderBy(entity => entity.UserName));
25         }
26     }

SearchModel

View：

分2种，一种是以Get形式刷新地提交查询条件的，分页可以在无刷新与刷新模式之间切换的，优化搜索引擎用的；另一种是无刷新形式提交查询条件的，分页亦是无刷新的。

这里需要将View分成2块，将数据展现的这块独立出来，便于无刷新地展示数据，所以做了个分部视图。

第一种（刷新的）：

 1 @model MvcPagerSearch.Models.SearchModel
 2 @{
 3     ViewBag.Title = "Index";
 4 }
 5
 6 <h2>查询</h2>
 7 @using(Html.BeginForm("Index", "Search", FormMethod.Get, new { @class = "form-search form-inline", id = "formMain" }))
 8 {
 9     <div class="input-append">
10     @Html.TextBoxFor(model => model.Age, new { @class = "span2 search-query" })
11     @Html.TextBoxFor(model => model.UserName, new { @class = "span2 search-query" })
12     @Html.TextBoxFor(model => model.Sex, new { @class = "span2 search-query" })
13     <button type="submit" class="btn">
14         快速查询</button>
15     </div>
16     <div data-valmsg-summary="true" class="text-warning"><ul></ul></div>
17 }
18
19 <div class="container">
20     <div id="pager"></div>
21     <div id="Content">
22     @Html.Partial("IndexTable")
23     </div>
24 </div>
25
26 @Url.IncludePagerScript()
27 <script type="text/javascript" src="@Url.Content("~/Scripts/jquery.validate.min.js")"></script>
28 <script type="text/javascript" src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"></script>
29 <script type="text/javascript">
30     $(function () {
31         $.pager({
32             content: "#Content",
33             pager: "#pager",
34             form: "#formMain",
35             @Html.Raw(Model.Extension),
36             refresh: false
37         });
38     });
39 </script>

Index.cshtml

分页的刷新、无刷新可以通过js中的refresh: false选项来调整

数据展现的分部视图：

 1 @model MvcPagerSearch.Models.SearchModel
 2 <table class="table table-hover">
 3     <thead>
 4         <tr>
 5             <th>
 6                 昵称
 7             </th>
 8             <th>
 9                 性别
10             </th>
11             <th>
12                 年龄
13             </th>
14         </tr>
15     </thead>
16     <tbody>
17     @if(Model.Members != null)
18     {
19         foreach(var entity in Model.Members)
20         {
21             <tr>
22                 <td>
23                     @entity.UserName
24                 </td>
25                 <td>
26                     @entity.Sex
27                 </td>
28                 <td>
29                     @entity.Age
30                 </td>
31             </tr>
32         }
33     }
34     </tbody>
35 </table>

IndexTable.cshtml

第二种（无刷新的）：

 1 @model MvcPagerSearch.Models.SearchModel
 2 @{
 3     ViewBag.Title = "Index";
 4 }
 5
 6 <h2>Ajax查询</h2>
 7 @using(Html.BeginForm("Index", "AjaxSearch", FormMethod.Post, new { @class="form-search form-inline", id="formMain" }))
 8 {
 9     <div class="input-append">
10         @Html.TextBoxFor(model => model.Age, new { @class = "span2 search-query" })
11         @Html.TextBoxFor(model => model.UserName, new { @class = "span2" })
12         @Html.TextBoxFor(model => model.Sex, new { @class = "span2" })
13         <button type="submit" class="btn">查询</button>
14     </div>
15     <div data-valmsg-summary="true" class="text-warning"><ul></ul></div>
16 }
17 <div class="container">
18     <div id="pager"></div>
19     <div id="Content">
20     @Html.Partial("IndexTable")
21     </div>
22 </div>
23 @Url.IncludeAjaxPagerScript()
24 <script type="text/javascript" src="@Url.Content("~/Scripts/jquery.validate.min.js")"></script>
25 <script type="text/javascript" src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"></script>
26 <script type="text/javascript">
27     $(function () {
28         $.ajaxPager({
29             content: "#Content",
30             pager: "#pager",
31             form: "#formMain"
32         });
33     });
34 </script>

Index.cshtml

数据展现的分部视图：

 1 @model MvcPagerSearch.Models.SearchModel
 2 @Html.Partial("~/Views/Shared/_AjaxPagerPartial.cshtml")
 3 <table class="table table-hover">
 4     <thead>
 5         <tr>
 6             <th>
 7                 昵称
 8             </th>
 9             <th>
10                 性别
11             </th>
12             <th>
13                 年龄
14             </th>
15         </tr>
16     </thead>
17     <tbody>
18     @if(Model.Members != null)
19     {
20         foreach(var entity in Model.Members)
21         {
22             <tr>
23                 <td>
24                     @entity.UserName
25                 </td>
26                 <td>
27                     @entity.Sex
28                 </td>
29                 <td>
30                     @entity.Age
31                 </td>
32             </tr>
33         }
34     }
35     </tbody>
36 </table>

IndexTable.cshtml

这里用到了另外个分部视图_AjaxPagerPartial.cshtml，用于记录查询条件与分页信息的。

Control:

2种方式的代码都一样：

 1 public class SearchController : Controller
 2     {
 3         //
 4         // GET: /Search/
 5         TestContext testContext = new TestContext();
 6
 7         public ActionResult Index(SearchModel model)
 8         {
 9             if(ModelState.IsValid)
10             {
11                 model.Members = testContext.Members;
12                 model.Search();
13             }
14
15             if(Request.IsAjaxRequest()) return PartialView("IndexTable", model);
16             return View("Index", model);
17         }
18     }

SearchController.cs

源代码：http://files.cnblogs.com/nickppa/MvcPagerSearch%E9%87%8D%E6%9E%84.rar