ASP.NET MVC 4使用PagedList.Mvc分页的实现代码

发布时间 - 2026-01-11 02:22:25    点击率:

ASP.NET MVC中进行分页的方式有多种,在NuGet上有提供使用PagedList、PagedList.Mvc进行分页。

在安装引用PagedList.Mvc的同时会安装引用PagedList。

复制代码 代码如下:
 @Html.PagedListPager((PagedList.IPagedList<SampleInfo>)ViewBag.Models, page => Url.Action("Index", new { page, keyword = Request["keyword"], datemin = Request["datemin"], datemax = Request["datemax"] }))

搜索触发事件:

 <input type="text" id="datemin" class="input-text Wdate" style="width:60px;" value="@Request["datemin"]">
 <input type="text" id="datemax" class="input-text Wdate" style="width:60px;" value="@Request["datemax"]">
 <input type="text" class="input-text" style="width:250px" placeholder="输入关键词" id="keyword" name="" value="@Request["keyword"]">
 <button type="submit" class="btn btn-success" id="" name="" onclick="search()"><i class="icon-search"></i> 搜索</button>
 <script>
 function search() {
  var url = "?type=1";
  if ($("#keyword").val() != "") {
   url += "&keyword=" + $("#keyword").val();
  }
  if ($("#datemin").val() != "") {
   url += "&datemin=" + $("#datemin").val();
  }
  if ($("#datemax").val() != "") {
   url += "&datemax=" + $("#datemax").val();
  }
  window.location.href = "/Admin/SampleInfo/Index"+url;
 }
 </script>

后台方法:

IQueryable<SampleInfo> models = db.SampleInfoBLL.GetAllEntities().Where(d => d.IsDel == false);
if (!String.IsNullOrEmpty(Request["keyword"]))
{
string keyword = Request["keyword"];
models = models.Where(d => d.Site_Chinese.Contains(keyword));
}
if (!String.IsNullOrEmpty(Request["datemin"]))
{
int datemin = Convert.ToInt32(Request["datemin"]);
models = models.Where(d => Convert.ToDouble(d.Lon_Degree) >= datemin);
}
if (!String.IsNullOrEmpty(Request["datemax"]))
{
int datemax = Convert.ToInt32(Request["datemax"]);
models = models.Where(d => Convert.ToDouble(d.Lat_Degree) <= datemax);
}
int page = 1;
if (Request["page"] != null)
{
page = Convert.ToInt32(Request["page"]);
}
ViewBag.ModelsCount = models.Count();
ViewBag.Models = models.OrderBy(d => d.SampleInfoID).ToPagedList(page, 10);

分页控件样式:

.pagination {
 display: inline-block;
 padding-left: 0;
 margin: 20px 0;
 border-radius: 4px;
}

.pagination > li {
 display: inline;
}

.pagination > li > a,
.pagination > li > span {
 position: relative;
 float: left;
 padding: 6px 12px;
 margin-left: -1px;
 line-height: 1.428571429;
 text-decoration: none;
 background-color: #ffffff;
 border: 1px solid #dddddd;
}

.pagination > li:first-child > a,
.pagination > li:first-child > span {
 margin-left: 0;
 border-bottom-left-radius: 4px;
 border-top-left-radius: 4px;
}

.pagination > li:last-child > a,
.pagination > li:last-child > span {
 border-top-right-radius: 4px;
 border-bottom-right-radius: 4px;
}

.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
 background-color: #eeeeee;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
 z-index: 2;
 color: #ffffff;
 cursor: default;
 background-color: #428bca;
 border-color: #428bca;
}

.pagination > .disabled > span,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
 color: #999999;
 cursor: not-allowed;
 background-color: #ffffff;
 border-color: #dddddd;
}

.pagination-lg > li > a,
.pagination-lg > li > span {
 padding: 10px 16px;
 font-size: 18px;
}

.pagination-lg > li:first-child > a,
.pagination-lg > li:first-child > span {
 border-bottom-left-radius: 6px;
 border-top-left-radius: 6px;
}

.pagination-lg > li:last-child > a,
.pagination-lg > li:last-child > span {
 border-top-right-radius: 6px;
 border-bottom-right-radius: 6px;
}

.pagination-sm > li > a,
.pagination-sm > li > span {
 padding: 5px 10px;
 font-size: 12px;
}

.pagination-sm > li:first-child > a,
.pagination-sm > li:first-child > span {
 border-bottom-left-radius: 3px;
 border-top-left-radius: 3px;
}

.pagination-sm > li:last-child > a,
.pagination-sm > li:last-child > span {
 border-top-right-radius: 3px;
 border-bottom-right-radius: 3px;
}

.pager {
 padding-left: 0;
 margin: 20px 0;
 text-align: center;
 list-style: none;
}

.pager:before,
.pager:after {
 display: table;
 content: " ";
}

.pager:after {
 clear: both;
}

.pager:before,
.pager:after {
 display: table;
 content: " ";
}

.pager:after {
 clear: both;
}

.pager li {
 display: inline;
}

.pager li > a,
.pager li > span {
 display: inline-block;
 padding: 5px 14px;
 background-color: #ffffff;
 border: 1px solid #dddddd;
 border-radius: 15px;
}

.pager li > a:hover,
.pager li > a:focus {
 text-decoration: none;
 background-color: #eeeeee;
}

.pager .next > a,
.pager .next > span {
 float: right;
}

.pager .previous > a,
.pager .previous > span {
 float: left;
}

.pager .disabled > a,
.pager .disabled > a:hover,
.pager .disabled > a:focus,
.pager .disabled > span {
 color: #999999;
 cursor: not-allowed;
 background-color: #ffffff;
}
.pagination-container {
 text-align: center;
}

分页样式效果:

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。


# ASP.NET  # MVC4  # 分页 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: Windows家庭版如何开启组策略(gpedit.msc)?(安装方法)  laravel怎么在请求结束后执行任务(Terminable Middleware)_laravel Terminable Middleware请求结束任务执行方法  Gemini手机端怎么发图片_Gemini手机端发图方法【步骤】  清除minerd进程的简单方法  如何用景安虚拟主机手机版绑定域名建站?  Android仿QQ列表左滑删除操作  Laravel如何实现模型的全局作用域?(Global Scope示例)  Laravel如何将应用部署到生产服务器_Laravel生产环境部署流程  Laravel怎么实现支付功能_Laravel集成支付宝微信支付  如何实现建站之星域名转发设置?  Android GridView 滑动条设置一直显示状态(推荐)  如何在云主机上快速搭建多站点网站?  INTERNET浏览器怎样恢复关闭标签页_INTERNET浏览器标签恢复快捷键与方法【指南】  Laravel storage目录权限问题_Laravel文件写入权限设置  利用JavaScript实现拖拽改变元素大小  Google浏览器为什么这么卡 Google浏览器提速优化设置步骤【方法】  Edge浏览器怎么启用睡眠标签页_节省电脑内存占用优化技巧  php做exe能调用系统命令吗_执行cmd指令实现方式【详解】  Laravel Admin后台管理框架推荐_Laravel快速开发后台工具  Laravel软删除怎么实现_Laravel Eloquent SoftDeletes功能使用教程  香港服务器部署网站为何提示未备案?  什么是javascript作用域_全局和局部作用域有什么区别?  Laravel怎么发送邮件_Laravel Mail类SMTP配置教程  智能起名网站制作软件有哪些,制作logo的软件?  ,交易猫的商品怎么发布到网站上去?  安克发布新款氮化镓充电宝:体积缩小 30%,支持 200W 输出  阿里云高弹*务器配置方案|支持分布式架构与多节点部署  如何在万网ECS上快速搭建专属网站?  php嵌入式断网后怎么恢复_php检测网络重连并恢复硬件控制【操作】  用v-html解决Vue.js渲染中html标签不被解析的问题  如何快速生成凡客建站的专业级图册?  深圳网站制作培训,深圳哪些招聘网站比较好?  个人网站制作流程图片大全,个人网站如何注销?  如何在搬瓦工VPS快速搭建网站?  Laravel控制器是什么_Laravel MVC架构中Controller的作用与实践  如何挑选最适合建站的高性能VPS主机?  百度浏览器如何管理插件 百度浏览器插件管理方法  Laravel如何实现RSS订阅源功能_Laravel动态生成网站XML格式订阅内容【教程】  购物网站制作费用多少,开办网上购物网站,需要办理哪些手续?  Laravel如何实现本地化和多语言支持?(i18n教程)  关于BootStrap modal 在IOS9中不能弹出的解决方法(IOS 9 bootstrap modal ios 9 noticework)  Laravel如何处理和验证JSON类型的数据库字段  Laravel数据库迁移怎么用_Laravel Migration管理数据库结构的正确姿势  Laravel如何使用Service Provider注册服务_Laravel服务提供者配置与加载  Laravel Artisan命令怎么自定义_创建自己的Laravel命令行工具完全指南  linux top下的 minerd 木马清除方法  详解Android中Activity的四大启动模式实验简述  Android okhttputils现在进度显示实例代码  Laravel如何使用软删除(Soft Deletes)功能_Eloquent软删除与数据恢复方法  教你用AI将一段旋律扩展成一首完整的曲子