.net Core学习笔记2 实现列表的条件筛选,排序,分页
打开vs,完善上次"简单粗暴"的项目
发现上次的实体类的导航属性有点问题,这是更改后的
namespace ProductMvc.Models
{
public class ProductType
{
public int ID { get; set; }
public string TypeName { get; set; } public ICollection<Product> product { get; set; }//一种类型可能有多个商品,所以是集合
}
} namespace ProductMvc.Models
{
public class Product
{
public int ID { get; set; }
public string ProductName { get; set; } public DateTime ProductDate { get; set; } public decimal Price { get; set; }
public int TypeID { get; set; }
public ProductType ProductType { get; set; }
}
}
为了列表展示方便我创建了一个专门用于展示的类
public class ProductViewModel
{
public int ID { get; set; }
public string ProductName { get; set; } public DateTime ProductDate { get; set; } public decimal Price { get; set; } public string TypeName { get; set; }
}
控制器的Index方法也要做相应的修改
public async Task<IActionResult> Index(string SortOrder, string SearchString,int id=)
{
ViewData["DATE_KEY"] = string.IsNullOrEmpty(SortOrder) ? "DATE_KEY" : "";
ViewData["TYPE_KEY"] = SortOrder == "TYPE_KEY" ? "TYPE_KEY" : "";
ViewData["SerachName"] = SearchString;
//连接查询
var products = from t in _context.ProductType
from p in _context.Product where
t.ID == p.TypeID
select new ProductViewModel { ID=p.ID,Price = p.Price, ProductDate = p.ProductDate, ProductName = p.ProductName, TypeName = t.TypeName };
//按条件查询
if(SearchString!=""&&SearchString!=null)
{
products = products.Where(p=>p.ProductName.Contains(SearchString));
}
//排序
switch(SortOrder)
{
case "DATE_KEY":
products = products.OrderByDescending(p=>p.ProductDate);
break;
case "TYPE_KEY":
products = products.OrderByDescending(p => p.TypeName);//倒序
break;
default:
products = products.OrderBy(p => p.ID);
break;
}
var pageOption = new PagerInBase
{
CurrentPage = id,//当前页数
PageSize = ,
Total = await products.CountAsync(),
RouteUrl = "/Products/Index"
}; //分页参数
ViewBag.PagerOption = pageOption; //数据
return View(await products.Skip((pageOption.CurrentPage - ) * pageOption.PageSize).Take(pageOption.PageSize).ToListAsync());
}
函数中的参数SortOrder用于排序,SearchString条件参数,id为分页参数下面是视图中的代码(有阴影的是修改过的地方):
@model IEnumerable<ProductMvc.Models.ProductViewModel>
@addTagHelper "ProductMvc.Models.PagerTagHelper,ProductMvc"
@{
ViewData["Title"] = "Index";
} <h2>商 品 列 表</h2> <p>
<a asp-action="Create"><input type="button" value="新 建" class="btn btn-default" /></a>
</p>
<form asp-action="Index" method="get">
<p>名称:<input type="text" name="searchString" value="@ViewData["SerachName"]"/>
<input type="submit" value="搜索" class="btn btn-default"/>
</p>
</form>
<table class="table">
<thead>
<tr>
<th>
商品名称
</th>
<th>
<a asp-action="Index" asp-route-SortOrder="@ViewData["DATE_KEY"]">生产日期</a>
</th>
<th>
价格
</th>
<th>
<a asp-action="Index" asp-route-SortOrder="@ViewData["TYPE_KEY"]">商品类型</a>
</th>
<th></th>
</tr>
</thead>
<tbody>
@foreach (var item in Model) {
<tr>
<td>
@Html.DisplayFor(modelItem => item.ProductName)
</td>
<td>
@Html.DisplayFor(modelItem => item.ProductDate)
</td>
<td>
@Html.DisplayFor(modelItem => item.Price)
</td>
<td>
@Html.DisplayFor(modelItem => item.TypeName)
</td>
<td>
<a asp-action="Edit" asp-route-id="@item.ID">编辑</a> |
<a asp-action="Details" asp-route-id="@item.ID">详情</a> |
<a asp-action="Delete" asp-route-id="@item.ID">删除</a>
</td>
</tr>
}
</tbody>
</table>
<pager pager-option="ViewBag.PagerOption as PagerInBase"></pager>
分页标签是用TagHelper实现的,这个主要是参考 “神牛步行3” http://www.cnblogs.com/wangrudong003/ 的博客完成的,直接贴代码,添加类PagerInBase
namespace ProductMvc.Models
{
#region 分页扩展 PagerInBase /// <summary>
/// 分页option属性
/// </summary>
public class PagerInBase
{
/// <summary>
/// 当前页 必传
/// </summary>
public int CurrentPage { get; set; }
/// <summary>
/// 总条数 必传
/// </summary>
public int Total { get; set; } /// <summary>
/// 分页记录数(每页条数 默认每页15条)
/// </summary>
public int PageSize { get; set; } /// <summary>
/// 路由地址(格式如:/Controller/Action) 默认自动获取
/// </summary>
public string RouteUrl { get; set; } /// <summary>
/// 样式 默认 bootstrap样式 1
/// </summary>
public int StyleNum { get; set; }
} /// <summary>
/// 分页标签
/// </summary>
public class PagerTagHelper : TagHelper
{ public PagerInBase PagerOption { get; set; } public override void Process(TagHelperContext context, TagHelperOutput output)
{ output.TagName = "div"; if (PagerOption.PageSize <= ) { PagerOption.PageSize = ; }
if (PagerOption.CurrentPage <= ) { PagerOption.CurrentPage = ; }
if (PagerOption.Total <= ) { return; } //总页数
var totalPage = PagerOption.Total / PagerOption.PageSize + (PagerOption.Total % PagerOption.PageSize > ? : );
if (totalPage <= ) { return; }
//当前路由地址
if (string.IsNullOrEmpty(PagerOption.RouteUrl))
{ //PagerOption.RouteUrl = helper.ViewContext.HttpContext.Request.RawUrl;
if (!string.IsNullOrEmpty(PagerOption.RouteUrl))
{ var lastIndex = PagerOption.RouteUrl.LastIndexOf("/");
PagerOption.RouteUrl = PagerOption.RouteUrl.Substring(, lastIndex);
}
}
PagerOption.RouteUrl = PagerOption.RouteUrl.TrimEnd('/'); //构造分页样式
var sbPage = new StringBuilder(string.Empty);
switch (PagerOption.StyleNum)
{
case :
{
break;
}
default:
{
#region 默认样式 sbPage.Append("<nav>");
sbPage.Append(" <ul class=\"pagination\">");
sbPage.AppendFormat(" <li><a href=\"{0}/{1}\" aria-label=\"Previous\"><span aria-hidden=\"true\">«</span></a></li>",
PagerOption.RouteUrl,
PagerOption.CurrentPage - <= ? : PagerOption.CurrentPage - ); for (int i = ; i <= totalPage; i++)
{ sbPage.AppendFormat(" <li {1}><a href=\"{2}/{0}\">{0}</a></li>",
i,
i == PagerOption.CurrentPage ? "class=\"active\"" : "",
PagerOption.RouteUrl); } sbPage.Append(" <li>");
sbPage.AppendFormat(" <a href=\"{0}/{1}\" aria-label=\"Next\">",
PagerOption.RouteUrl,
PagerOption.CurrentPage + > totalPage ? PagerOption.CurrentPage : PagerOption.CurrentPage + );
sbPage.Append(" <span aria-hidden=\"true\">»</span>");
sbPage.Append(" </a>");
sbPage.Append(" </li>");
sbPage.Append(" </ul>");
sbPage.Append("</nav>");
#endregion
}
break;
} output.Content.SetHtmlContent(sbPage.ToString());
} }
#endregion
}
最后的效果:
好吧我觉得依然的简单粗暴,在后期我会不断的完善的。
新手上路,还望大佬们指正
.net Core学习笔记2 实现列表的条件筛选,排序,分页的更多相关文章
- .net Core学习笔记3 编辑列表并绑定下拉列
本次主要实现列表的编辑及下拉列表的绑定 先看效果图: 主要用DropDownList绑定下拉列后端代码: 1:定义一个存下拉数据类 public class SelectItem { public s ...
- .NET CORE学习笔记系列(2)——依赖注入[7]: .NET Core DI框架[服务注册]
原文https://www.cnblogs.com/artech/p/net-core-di-07.html 包含服务注册信息的IServiceCollection对象最终被用来创建作为DI容器的IS ...
- .NET CORE学习笔记系列(2)——依赖注入[5]: 创建一个简易版的DI框架[下篇]
为了让读者朋友们能够对.NET Core DI框架的实现原理具有一个深刻而认识,我们采用与之类似的设计构架了一个名为Cat的DI框架.在上篇中我们介绍了Cat的基本编程模式,接下来我们就来聊聊Cat的 ...
- .NET CORE学习笔记系列(2)——依赖注入[6]: .NET Core DI框架[编程体验]
原文https://www.cnblogs.com/artech/p/net-core-di-06.html 毫不夸张地说,整个ASP.NET Core框架是建立在一个依赖注入框架之上的,它在应用启动 ...
- .NET CORE学习笔记系列(2)——依赖注入[4]: 创建一个简易版的DI框架[上篇]
原文https://www.cnblogs.com/artech/p/net-core-di-04.html 本系列文章旨在剖析.NET Core的依赖注入框架的实现原理,到目前为止我们通过三篇文章从 ...
- .NET CORE学习笔记系列(2)——依赖注入【3】依赖注入模式
原文:https://www.cnblogs.com/artech/p/net-core-di-03.html IoC主要体现了这样一种设计思想:通过将一组通用流程的控制权从应用转移到框架中以实现对流 ...
- .NET CORE学习笔记系列(2)——依赖注入【2】基于IoC的设计模式
原文:https://www.cnblogs.com/artech/p/net-core-di-02.html 正如我们在<控制反转>提到过的,很多人将IoC理解为一种“面向对象的设计模式 ...
- .NET CORE学习笔记系列(2)——依赖注入【1】控制反转IOC
原文:https://www.cnblogs.com/artech/p/net-core-di-01.html 一.流程控制的反转 IoC的全名Inverse of Control,翻译成中文就是“控 ...
- KVM虚拟化学习笔记系列文章列表(转)
Kernel-based Virtual Machine KVM虚拟化学习笔记系列文章列表----------------------------------------kvm虚拟化学习笔记(一)之k ...
随机推荐
- FFmpeg编译iOS静态库
第一步:下载gas-preprocessor 1.1 下载https://github.com/libav/gas-preprocessor 1.2 拷贝 gas-preprocessor.pl 到 ...
- 阿里mysql同步工具otter的docker镜像
https://github.com/dearplain/otter_manager https://github.com/dearplain/otter_node 本人开发的小巧docker镜像,根 ...
- MVC异步加载学习笔记
一.普通的异步请求 1.View层 <input type="text" id="Name" value="" placeholder ...
- 三种ajax上传文件方法
1. XMLHttpRequest(原生ajax) <input class="file" type="file" id="fafafa&qu ...
- LeetCode第[11]题(Java):Container With Most Water 标签:Array
题目难度:Medium Given n non-negative integers a1, a2, ..., an, where each represents a point at coordina ...
- git 删除分支操作
删除分支时自己不能够在要删除的分支上 删除本地的某个分支 git branch -d branchname # 交互式删除分支 git branch -D branchname # 强制删除分支 删除 ...
- MVVMLight 1:MVVMLight介绍以及在项目中的使用
一.MVVM 和 MVVMLight介绍 MVVM是Model-View-ViewModel的简写.类似于目前比较流行的MVC.MVP设计模式,主要目的是为了分离视图(View)和模型(Model)的 ...
- mwValidate.js验证插件
这段时间在公司一直做项目的同时,也学了下js,感觉有必要做一些什么东西出来.思来想去就做了最简单的一个验证插件.我很清楚这个东西市面上已经很多了,但我的目的也很清楚,检验我的学习成果.所以也就无所谓了 ...
- Eclipse导入Hadoop源码项目及编写Hadoop程序
一 Eclipse导入Hadoop源码项目 基本步骤: 1)在Eclipse新建一个java项目[hadoop-1.2.1] 2)将Hadoop压缩包解压目录src下的core,hdfs,mapred ...
- 学习SpirngMVC之如何获取请求参数
学习SpringMVC——如何获取请求参数 @RequestParam,你一定见过:@PathVariable,你肯定也知道:@QueryParam,你怎么会不晓得?!还有你熟悉的他(@Cooki ...