最近在写一些web应用了解了一下asp.net mvc发现的确好用,所以直接就干上了。不过在使用asp.net mvc的Razor模板的情况并不向传统webform那样可以使用控件。但从Razor的功能上已经具备相关代替的功能,只是从Razor角度来说不是我们平常说的控件而是子模板。由于Razor可以根据自己需求把功能拆分到子模板中,然后通过RenderPage方法输出。从设计的手段上来看完全可以把分页控件封装成一个子的cshtml,在需要的时候引用上就是了。

作为一个控件的设计其最重要的环节是隔离和独立性,在这方面Razor也考虑得比较周到,通过PageData可以简单地进行模板之间的数据偶合问题。下面通过Razor实现一个简单的分页控件,在实现过程只需要编写一个简单的cshtml的模板即可。在使用上也并不需要引用什么代码或DLL,直接在需要的地方嵌入相关cshtml则可以分页控件的功能。

参数制定

一个控件要输出信息必须制定相关的数据规范,一个简单的分页控件其实只需要两个参数即可以,分别当前页索引和总页数。可以在Razor模板的顶部声音一下数据规范

@{
int pageindex = (int)PageData["pageindex"];
int spitindex = ;
int pagecount = (int)PageData["pagecount"];
}

这两上参数就是告诉使用者在调用RenderPage输入的时候必须带上这两个参数值.

分页URL制定

在一些数据查询中往往在URL上会带上一些相关参数,所以在输入分页URL的时候需要简单地处理一下。

@functions{
public static string GetUrl(int index)
{
System.Collections.Specialized.NameValueCollection querystring = HttpContext.Current.Request.QueryString;
System.Text.StringBuilder sb = new System.Text.StringBuilder();
sb.Append("?").AppendFormat("pageindex=" + index);
foreach(string key in querystring.Keys)
{
if (key != "pageindex")
sb.AppendFormat("&{0}={1}", key, HttpContext.Current.Server.UrlEncode(querystring[key]));
}
return sb.ToString();
}
}

简单地把pageindex附加到当前url querystring即可.

分页内容输出

有了以上信息那构建一个分页内容输出就是件简单的事情了。

<div class="pagebar">
<ul> <li id="pageinfo"><a>@Html.Raw(pageindex + 1) / @pagecount</a></li>
@if (pageindex > 0)
{
<li><a href="@GetUrl(pageindex-1)">Previous</a> </li>
}
@{ spitindex = pageindex - 2;}
@if (spitindex > 4)
{ <li><a href="@GetUrl(0)">1</a> </li>
<li><a href="@GetUrl(spitindex - 2)">...</a> </li>
}
else
{
for (int i = 0; i < spitindex; i++)
{ <li><a href="@GetUrl(i)">@Html.Raw(i + 1)</a> </li> }
}
@for (int i = pageindex - 2; i < pageindex; i++)
{
if (i >= pageindex || i <)
{
continue;
} <li><a href="@GetUrl(i)">@Html.Raw(i+1)</a> </li> }
<li><a id="selectpage"><b>@Html.Raw(pageindex+1)</b> </a></li>
@for (int i = pageindex + 1; i < pagecount; i++)
{
if (i >= pageindex + 3)
{
break;
} <li><a href="@GetUrl(i)">@Html.Raw(i+1)</a> </li> }
@{ spitindex = pageindex + 3; }
@if (pagecount - 4 > spitindex)
{
<li><a href="@GetUrl(spitindex + 2)">...</a> </li>
<li><a href="@GetUrl(pagecount - 1)">@pagecount</a> </li>
}
else
{
for (int i = spitindex; i < pagecount; i++)
{ <li><a href="@GetUrl(i)">@Html.Raw(i+1)</a> </li>
}
}
@if (pageindex != pagecount - 1)
{ <li><a href="@GetUrl(pageindex + 1)">Next</a> </li> }
</ul>
</div>

使用控件

控件使用非常简单只需要在Razor通过RenderPage输出即可

@RenderPage("~/views/controls/pagebar.cshtml", new { pageindex = Model.PageIndex, pagecount = Model.PageCount })

控件效果

asp.net mvc简单实现基于Razor的分页控件的更多相关文章

  1. 自定义分页控件-基于Zhifeiya的分页控件改版

    基于Zhifeiya的分页控件改版的分页. html显示代码: <div class="pagelist"> {{.pagerHtml}} </div> c ...

  2. MVC无刷新查询,PagedList分页控件使用,导出Excel

    使用MVC开发也有一段时间了,总结下无刷新部分视图的使用.PagedList分页控件的使用. @using PagedList @model StaticPagedList<T> < ...

  3. ASP.NET MVC CheckBoxFor为什么会生成hidden input控件

    自己开发的公众号,可以领取淘宝内部优惠券 @Html.CheckBoxFor(m => m.Bool) 使用CheckBoxFor方法得到的html代码会是下面这个样子 <input ch ...

  4. asp.net webform 自定义分页控件

    做web开发一直用到分页控件,自己也动手实现了个,使用用户自定义控件. 翻页后数据加载使用委托,将具体实现放在在使用分页控件的页面进行注册. 有图有真相,给个直观的认识: 自定义分页控件前台代码: & ...

  5. ASP.NET MVC 学习笔记-2.Razor语法 ASP.NET MVC 学习笔记-1.ASP.NET MVC 基础 反射的具体应用 策略模式的具体应用 责任链模式的具体应用 ServiceStack.Redis订阅发布服务的调用 C#读取XML文件的基类实现

    ASP.NET MVC 学习笔记-2.Razor语法   1.         表达式 表达式必须跟在“@”符号之后, 2.         代码块 代码块必须位于“@{}”中,并且每行代码必须以“: ...

  6. 在ASP.NET MVC中实现基于URL的权限控制

    本示例演示了在ASP.NET MVC中进行基于URL的权限控制,由于是基于URL进行控制的,所以只能精确到页.这种权限控制的优点是可以在已有的项目上改动极少的代码来增加权限控制功能,和项目本身的耦合度 ...

  7. ASP.NET MVC 简单介绍①

    ASP.NET  MVC 简单介绍① 只做了重要描述,内容出自菜鸟教程网站内容. 目录 1布局 2HTML 帮助器 3.Razor 语法 4.添加样式 5.Layout 6. Controllers ...

  8. ASP.NET MVC 简单事务添加

    ASP.NET MVC 简单事务 //实例化查询上下文 using ( BookStoreEntities db = new BookStoreEntities()) { //找到需要价格和名称的数据 ...

  9. ASP.NET MVC 简单分页代码

    using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.We ...

随机推荐

  1. git 的常用命令(未完待补充)

    一.初始化 git git init 这样会默认创建 master 分支 二.查看当前状态 git status  查看 git 的默认状态 三.创建一个文件,并把它添加到 git 仓库,使用 git ...

  2. CentOS7安装及简单配置(一)

    CentOS7是RHEL的社区版,摘抄维基百科的一段话如下: CentOS(Community Enterprise Operating System)是Linux发行版之一,它是来自于Red Hat ...

  3. git逻辑和基本命令

    提交和推送的区别 提交(commit):把您做的修改,保存到本地仓库中 推送(push):把您本地仓库的代码推送至服务器(一般是远程服务器及gitlab或github) 拉取和获取的区别 git  p ...

  4. 在VB中动态执行VBS代码,可操控窗体控件

    通过执行一段VBS代码来操控窗体内的控件也可以使用AddObject方法添加自己的类,那么在动态VBS代码中也一样可以使用在增加程序扩展性或是有脚本化需求的时候,这个方法还是不错的. Option E ...

  5. swoole+websocket+redis实现一对一聊天

    如同web端的QQ和微信一样,这是一个web端的聊天程序. 环境:ubuntu + php + swoole扩展 + redis + mysql Redis 实现每个连接websocket的服务都唯一 ...

  6. 过滤html标签

    public static String delHTMLTag(String htmlStr){ String regEx_script="<script[^>]*?>[\ ...

  7. 通过CMD将文件copy到远程电脑

    net use \\192.168.1.112\ipc$ admin /user:admin #第一个admin是密码,第二admin是用户名: xcopy test.txt \\192.168.1. ...

  8. Echarts 几个常用图

    最近公司业务上的 需求,要求做一些图表,我们技术框架上选择方便使用的Echarts. 下面是效果图: 下面是具体代码: <!DOCTYPE html> <html> <h ...

  9. 微服务架构-选择Spring Cloud,放弃Dubbo

    Spring Cloud 在国内中小型公司能用起来吗?从 2016 年初一直到现在,我们在这条路上已经走了一年多. 在使用 Spring Cloud 之前,我们对微服务实践是没有太多的体会和经验的.从 ...

  10. vue-cli的跨域设置

    概述 今天打算快速使用vue-cli建立一个小应用用于测试,使用axios发送http请求,但是遇到了跨域问题,总结了一下,供以后开发时参考,相信对其他人也有用. vue-cli的跨域设置 在vue. ...