asp.net mvc多条件+分页查询解决方案
开发环境vs2010
css:bootstrap
js:jquery
bootstrap paginator
原先只是想做个mvc的分页,但是一般的数据展现都需要检索条件,而且是多个条件,所以就变成了MVC多条件+分页查询
因为美工不是很好,所以用的是bootstrap前端框架,自己懒得写前端的分页控件,用的是bootstrap paginator分页控件。
方式:
用Get方式提交检索条件,分页可用2种模式,无刷新或者带刷新的跳转。
Shared\_Layout.cshtml中添加css、js脚本引用:
<!DOCTYPE html>
<html>
<head>
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/bootstrap/css/bootstrap.min.css")" rel="stylesheet" media="screen" />
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/bootstrap.min.js")"></script>
</head> <body>
<div class="container">
@RenderBody()
</div>
</body>
</html>
_Layout.cshtml
查询页面(View)Index.cshtml:
引用分页插件库、生成分页脚本,定义分页跟数据展现的分部视图:
@Url.IncludePagerScript()
@Html.Pager("#pager", "#Content", "/Search/?page=", Model)
<div class="container">
<div id="pager"></div>
<div id="Content">
@Html.Partial("IndexTable")
</div>
</div>
封装了下分页脚本:
@Html.Pager(分页控件, 数据展现, 分页的查询地址, 继承PagerSearchBase的Model,是否刷新默认为刷新的)
若要切换成分页的无刷新模式,只需要写成@Html.Pager("#pager", "#Content", "/Search/?page=", Model, false)
public static MvcHtmlString Pager(this HtmlHelper htmlHelper, string filter, string content, string url, MvcPagerSearch.Models.PagerSearchBase pagerbase, bool refresh = true)
{
return Pager(htmlHelper, filter, content, url, pagerbase.CurrentPage, pagerbase.PageCount, pagerbase.Condition, refresh);
} public static MvcHtmlString Pager(this HtmlHelper htmlHelper, string filter, string content, string url, int currentPage, int pageCount, string condition = "", bool refresh = true)
{
if(pageCount <= ) return new MvcHtmlString(string.Empty);
string requestUrl = string.Empty;
if(condition == null) condition = string.Empty;
if(condition.Length > && condition.Substring(, ) != "&")
{
condition = "&" + condition;
}
requestUrl = "\"" + url + "\" + page + \"" + condition + "&rand=\" + Math.random()";
return new MvcHtmlString("<script type=\"text/javascript\">$(function () {"
+ " $(\"" + filter + "\").bootstrapPaginator({ currentPage: " + currentPage + ","
+ " totalPages: " + pageCount + ","
+ " numberOfPages: 10,"
+ " size:\"large\","
+ " alignment: \"center\","
+ " useBootstrapTooltip: true,"
+ " tooltipTitles: function (type, page, current) {"
+ " switch (type) {"
+ " case \"first\":"
+ " return \"首页 <i class='icon-fast-backward icon-white'></i>\";"
+ " case \"prev\":"
+ " return \"上一页 <i class='icon-backward icon-white'></i>\";"
+ " case \"next\":"
+ " return \"下一页 <i class='icon-forward icon-white'></i>\";"
+ " case \"last\":"
+ " return \"最末页 <i class='icon-fast-forward icon-white'></i>\";"
+ " case \"page\":"
+ " return \"第 \" + page + \"页 <i class='icon-file icon-white'></i>\";"
+ " }"
+ " },"
+ " onPageClicked: function (event, originalEvent, type, page) {"
+ (refresh ? " location.href = " + requestUrl + ";" : " $.post(" + requestUrl + ", function (data) { $(\"" + content + "\").html(data); });")
+ " }"
+ " });"
+ " });</script>");
}
Html.Pager的源代码
定义查询表单:
@using(Html.BeginForm("Index", "Search", FormMethod.Get, new { @class = "form-search form-inline" }))
{
<div class="input-append">
@Html.TextBoxFor(model => model.UserName, new { @class = "span2 search-query" })
<button type="submit" class="btn">
快速查询</button>
</div>
}
整个Index.cshtml与分部视图IndexTable.cshtml的源代码:
@model MvcPagerSearch.Models.SearchModel
@{
ViewBag.Title = "Index";
}
@Url.IncludePagerScript()
@Html.Pager("#pager", "#Content", "/Search/?page=", Model)
<h2>查询</h2>
@using(Html.BeginForm("Index", "Search", FormMethod.Get, new { @class = "form-search form-inline" }))
{
<div class="input-append">
@Html.TextBoxFor(model => model.UserName, new { @class = "span2 search-query" })
<button type="submit" class="btn">
快速查询</button>
</div>
}
<div class="container">
<div id="pager"></div>
<div id="Content">
@Html.Partial("IndexTable")
</div>
</div>
Index.cshtml
@model MvcPagerSearch.Models.SearchModel
<table class="table table-hover">
<thead>
<tr>
<th>
昵称
</th>
<th>
性别
</th>
<th>
年龄
</th>
</tr>
</thead>
<tbody>
@foreach(var entity in Model.Members)
{
<tr>
<td>
@entity.UserName
</td>
<td>
@entity.Sex
</td>
<td>
@entity.Age
</td>
</tr>
}
</tbody>
</table>
IndexTable.cshtml
控制器(Control)SearchController.cs:
Index:
public ActionResult Index(int page = )
{
SearchModel conditionData = SearchModel.Create(Request, GetMembers());
conditionData.Search(page); if(Request.IsAjaxRequest()) return PartialView("IndexTable", conditionData);
return View("Index", conditionData);
}
取得数据(测试数据):
// 获取数据
private List<Member> GetMembers()
{
List<Member> result = new List<Member>();
for(int i = ; i <= ; i++)
{
result.Add(new Member() { UserName = "A" + i, Age = i, Sex = i % == ? "男" : "女" });
}
return result;
}
测试数据
模型(Model)SearchModel.cs、Member.cs:
SearchModel继承自PagerSearchBase
public class SearchModel : PagerSearchBase
{
public string UserName { get; set; } public IEnumerable<Member> Members { get; set; }
}
创建SearchModel对象的方法:
public static SearchModel Create(HttpRequestBase request, IEnumerable<Member> members)
{
SearchModel result = new SearchModel();
result.AddFields(request, "UserName");
result.Members = members;
return result;
}
protected void AddFields(HttpRequestBase request, params string[] fieldNames);
用于添加查询条件的属性名,并为属性设置值,这里的属性只能是string类型的
重载子类的SearchByPage函数
protected override void SearchByPage(int page)
{
// 过滤
Members = Members.Where(UserName, entity => entity.UserName.Contains(UserName));
// 分页
Members = Pager(Members.OrderBy(entity => entity.UserName));
}
扩展了下IEnumerable<TSource>的Where函数,若遇到UserName为空,则不进行条件过滤,且能链式调用
public static IEnumerable<TSource> Where<TSource>(this IEnumerable<TSource> data, string condition, Func<TSource, bool> predicate)
{
if(string.IsNullOrEmpty(condition)) return data;
return data.Where(predicate);
} public static IEnumerable<TSource> Where<TSource>(this IEnumerable<TSource> data, string condition, Func<TSource, int, bool> predicate)
{
if(string.IsNullOrEmpty(condition)) return data;
return data.Where(predicate);
}
扩展Where函数
PagerSearchBase.cs基类
public abstract class PagerSearchBase
{
/// <summary>
/// 每页行数,默认20,子类可调
/// </summary>
protected int pageSize = ;
private int pageCount = ;
private Hashtable hsCondition = new Hashtable(); /// <summary>
/// 总页数
/// </summary>
public int PageCount { get { return pageCount; } set { pageCount = value; } } /// <summary>
/// 当前页
/// </summary>
public int CurrentPage { get; protected set; } /// <summary>
/// 条件Url
/// </summary>
public string Condition { get; protected set; } /// <summary>
/// 按页查询
/// </summary>
/// <param name="page"></param>
protected abstract void SearchByPage(int page); /// <summary>
/// 取得条件,可外部调用
/// </summary>
/// <returns></returns>
public string GetCondition()
{
string result = string.Empty;
int i = ;
foreach(object key in hsCondition.Keys)
{
if(i++ > )
result += "&";
result += key.ToString() + "=" + HttpUtility.UrlEncode(hsCondition[key].ToString().Trim());
}
return result;
} /// <summary>
/// 按页查询,外部调用
/// </summary>
/// <param name="page"></param>
public void Search(int page)
{
// 设置当前页
CurrentPage = page;
// 取得反馈的条件Url
Condition = GetCondition();
SearchByPage(page);
} /// <summary>
/// 批量添加用于查询条件的属性名,并为属性设置值
/// </summary>
/// <param name="request"></param>
/// <param name="fieldNames"></param>
protected void AddFields(HttpRequestBase request, params string[] fieldNames)
{
for(int i = ; i <= fieldNames.Length - ; i++)
{
string fieldName = fieldNames[i];
string value = WebUtil.GetSafeQueryString(request, fieldName).Trim();
// 设置属性值
this.GetType().GetProperty(fieldName).SetValue(this, value, null);
// 添加反馈的条件Url
AddCondition(fieldName, value);
}
} /// <summary>
/// 分页
/// </summary>
/// <typeparam name="T"></typeparam>
/// <param name="searchData"></param>
/// <returns></returns>
protected IEnumerable<T> Pager<T>(IEnumerable<T> searchData)
{
return PagerUtil.GetPageData(CurrentPage, pageSize, searchData, out pageCount);
} /// <summary>
/// 添加反馈的条件Url,内部方法
/// </summary>
/// <param name="name"></param>
/// <param name="value"></param>
private void AddCondition(string name, string value)
{
if(!string.IsNullOrEmpty(value))
hsCondition.Add(name, value);
}
}
PagerSearchBase.cs
Member.cs
public class Member
{
public string UserName { get; set; }
public int Age { get; set; }
public string Sex { get; set; }
}
这样就完成了多条件查询+分页的页面。
如果要增加条件,就只要修改Model跟View就可以了
如要增加个Age的条件:
修改Model:
增加属性字段:public string Age { get; set; }
原result.AddFields(request, "UserName");改为result.AddFields(request, "UserName", "Age");
SearchByPage中增加过滤条件:
protected override void SearchByPage(int page)
{
int age = ;
if(!Int32.TryParse(Age, out age)) Age = string.Empty;
// 过滤
Members = Members.Where(UserName, entity => entity.UserName.Contains(UserName))
.Where(Age, entity => entity.Age == age);
// 分页
Members = Pager(Members.OrderBy(entity => entity.UserName));
}
完整的SearchModel.cs文件:
public class SearchModel : PagerSearchBase
{
public string UserName { get; set; }
public string Age { get; set; } public IEnumerable<Member> Members { get; set; } public static SearchModel Create(HttpRequestBase request, IEnumerable<Member> members)
{
SearchModel result = new SearchModel();
result.AddFields(request, "UserName", "Age");
result.Members = members;
return result;
} protected override void SearchByPage(int page)
{
int age = ;
if(!Int32.TryParse(Age, out age)) Age = string.Empty;
// 过滤
Members = Members.Where(UserName, entity => entity.UserName.Contains(UserName))
.Where(Age, entity => entity.Age == age);
// 分页
Members = Pager(Members.OrderBy(entity => entity.UserName));
}
}
SearchModel.cs
修改View:
在Index.cshtml查询的表单中增加查询条件:
@Html.TextBoxFor(model => model.Age, new { @class = "span2 search-query" })
完整的Index.cshtml文件:
@model MvcPagerSearch.Models.SearchModel
@{
ViewBag.Title = "Index";
}
@Url.IncludePagerScript()
@Html.Pager("#pager", "#Content", "/Search/?page=", Model)
<h2>查询</h2>
@using(Html.BeginForm("Index", "Search", FormMethod.Get, new { @class = "form-search form-inline" }))
{
<div class="input-append">
@Html.TextBoxFor(model => model.Age, new { @class = "span2 search-query" })
@Html.TextBoxFor(model => model.UserName, new { @class = "span2 search-query" })
<button type="submit" class="btn">
快速查询</button>
</div>
}
<div class="container">
<div id="pager"></div>
<div id="Content">
@Html.Partial("IndexTable")
</div>
</div>
Index.cshtml
就可以了,应该是挺方便了
完整项目文件下载:
http://files.cnblogs.com/nickppa/MvcPagerSearch.rar
asp.net mvc多条件+分页查询解决方案的更多相关文章
- 重构MVC多条件分页解决方案
重构MVC多条件+分页解决方案 为支持MVC的验证,无刷新查询,EF,以及让代码可读性更强一点,所以就重构了下原来的解决方案. 这里就简单讲下使用方法吧: Model: 继承PagerBase: S ...
- ASPNETCOREAPI 跨域处理 SQL 语句拼接 多条件分页查询 ASPNET CORE 核心 通过依赖注入(注入服务)
ASPNETCOREAPI 跨域处理 AspNetCoreApi 跨域处理 如果咱们有处理过MV5 跨域问题这个问题也不大. (1)为什么会出现跨域问题: 浏览器安全限制了前端脚本跨站点的访问资源, ...
- 【java】spring-data-jpa 集成hibernate实现多条件分页查询
初次接触spring-data-jpa,实现多条件分页查询. 基础环境 Spring Boot+spring-data-jpa+hibernate+mysql 1.接口 要继承这个接口,这个接口提供了 ...
- ASP.NET MVC利用PagedList分页(二)PagedList+Ajax+JsRender
(原文) 昨天在ASP.NET MVC利用PagedList分页(一)的 最后一节提到,一个好的用户体验绝对不可能是点击下一页后刷新页面,所以今天来说说利用Ajax+PagedList实现无刷新(个人 ...
- 返璞归真 asp.net mvc (1) - 添加、查询、更新和删除的 Demo
原文:返璞归真 asp.net mvc (1) - 添加.查询.更新和删除的 Demo [索引页] [源码下载] 返璞归真 asp.net mvc (1) - 添加.查询.更新和删除的 Demo 作者 ...
- thinkphp 带条件分页查询
thinkphp 带条件分页查询:form表单传值时候,method='get'. 用 get 传值
- asp.net mvc easyui datagrid分页
提到 asp.net mvc 中的分页,很多是在用aspnetpager,和easyui datagrid结合的分页却不多,本文介绍的是利用easyui 中默认的分页控件,实现asp.net mvc分 ...
- 项目一:第四天 1、快递员的条件分页查询-noSession,条件查询 2、快递员删除(逻辑删除) 3、基于Apache POI实现批量导入区域数据 a)Jquery OCUpload上传文件插件使用 b)Apache POI读取excel文件数据
1. 快递员的条件分页查询-noSession,条件查询 2. 快递员删除(逻辑删除) 3. 基于Apache POI实现批量导入区域数据 a) Jquery OCUpload上传文件插件使用 b) ...
- asp.net mvc jqgrid 同一个页面查询不同的表,jqgrid显示不同表的表头和数据并且分页
基于我上一篇文章<a href="http://www.cnblogs.com/alasai/p/4765756.html">asp.net mvc excel导入&l ...
随机推荐
- 解决表单(搜索框)回车的时候直接提交了表单不运行js的问题
我想在搜索输入框中输入关键词后回车,先运行一段js,然后在提交表单,而默认情况下回车的时候也会出发表单的提交所有没法等js运行完成,故利用 onkeydown="if(event.keyCo ...
- RabbitMQ在window的搭建
RabbitMq window 搭建设置过程,网上有些说的不太明白,所以亲自操刀测试过程,参考了很多人的资料,多谢各位大神的宝贵资料第一步:装RabbitMq运行环境,类似一个虚拟机的东东 1.otp ...
- day26_网络编程第一天
1.网络通信三要素(掌握) IP 端口号 协议(UPD&TCP) 2.UDP协议与TCP协议各自特点(掌握) UDP 1.不需要建立连接: 2.有数据大小限制,每个 ...
- RPM方式安装MySQL5.6
原文转自:http://blog.csdn.net/liumm0000/article/details/18841197 未整理! RPM方式安装MySQL5.6 a. 检查MySQL及相关RPM包, ...
- word2vec + transE 知识表示模型
本文主要工作是将文本方法 (word2vec) 和知识库方法 (transE) 相融合作知识表示,即将外部知识库信息(三元组)加入word2vec语言模型,作为正则项指导词向量的学习,将得到的词向量用 ...
- akka各模块
Akka的模块化做得非常好,它为不同的功能提供了不同的Jar包. akka-actor-2.0.jar – 标准Actor, 有类型Actor,等等 akka-remote-2.0.jar – 远程A ...
- ViewStub的简单用法和说明
最近无意间知道了ViewStub,所以特地的去了解了一下 都知道ViewStub是一个不可见的,大小为0的View,实际上跟include差不多,但是ViewStub要更加节约资源.被称为是" ...
- Dos学习笔记(2)dos屏幕内容的复制
方法1,选择复制,右键dos屏幕=>标记=>然后选择开始复制的地方,拖动覆盖要复制的内容,好了之后,按回车键(Enter). 方法2,全部复制,右键dos屏幕=>全选=>然后回 ...
- 浏览器与web客户端的HTTP交互过程
未经许可谢绝以任何形式对本文内容进行转载! HTTP协议是常见的几种应用层协议之一,当我们用浏览器和web客户端进行交互时html页面等内容的传输都是依靠该协议完成的.值得注意的是,HTTP使用的是T ...
- 使用RXTX获取电脑串口
RXTX是javacomm串口通信的一个扩展 RXTX开发所需文件的下载地址:http://rxtx.qbang.org/wiki/index.php/Download 解压之后可以看到支持各个平台的 ...