asp.net mvc3 技术(二) webgrid 的使用方法 -ag凯发k8国际
在 asp.net mvc 3 中，webgrid 是 web.helpers 下的新的类，使用 webgrid 可以减小我们的代码量，本篇先简单的看下 webgrid 的使用方法，包括它的分页、排序功能以及样式的设置等。
我们还是从留言表读取数据，并使用 webgrid 来展示我们的留言。webgrid 大体原理就是将数据集合组织输出一个 html 表格，使用 webgrid 我们先创建一个 webgrid 类的实体，如下：
@modelilist<android.models.contact>@{//创建实体var grid =newwebgrid(model);}当我们查看 webgrid 类时会发现 webgrid 构造函数有很多的参数，我们可以根据参数名便基本上能了解参数的意思，使用到时我们再做介绍。接下来使用 gethtml 方法来组织网格，下边直接给出最终的方法：
@{var grid =newwebgrid(model, canpage:true, rowsperpage:2);@grid.gethtml(tablestyle:"contacttb",headerstyle:"contacthd",columns: grid.columns( grid.column("username","用户名", style:"username", format:@<b>@item.usernameb>),grid.column("content","留言内容", style:"content", cansort:false),grid.column("addtime","留言时间", style:"addtime"),grid.column(style:"edit",format:(item)=>html.actionlink("编辑","edit",new{ id = item.id })),grid.column(style:"delete", format:(item)=>html.actionlink("删除","delete",new{ id = item.id }))));}这里稍做下解释，1. canpage 为 true 表示允许翻页，rowsperpage 为2表示每页显示2条，发现参数名基本上很明确的表示了它的意思."tablestyle"是表名所使用的css样式名，这样headerstyle等样 式的就不能理解了，style分别是各列所使用的css样式名；3."cansort"即为是否可排序，默认为可以。最后的两列是 webgrid 中链接的写法，分别为编辑和删除操作，可以参考下asp.net mvc3 实例(六) 增加、修改和删除操作(二)。所使用的css样式如下：
.contacttb{border:1px solid #ecf2fd;border-collapse:collapse;}.contacthd{background:#d4dee8;}.contacttb th,.contacttb td{border:1px solid #03a5d1;}.contacttb tbody tr:hover{background:#e9e9e9;}.contacttb tfoot td{text-align:right;}.contacttb tfoot a{border:1px solid blue;padding:05px;}.username{width:100px;}.content{width:400px;}.addtime{width:120px;}.edit{width:30px;}.delete{width:30px;}我们看下这时的输出，此时我们已经可以根据用户名、留言时间来进行排序，并能进行翻页，如下：
我们不难发现，这种方法翻页时每次会将所有的数据取出来，当数据量大的时候是不可行的，后边我们会介绍更好的方法。本篇的 asp.net mvc3 中使用 webgrid 的方法完全可以用于我们一般的用户管理等数据量小的操作中，可见会为我们省下不少时间。
转载于:https://www.cnblogs.com/caltion/archive/2011/10/26/2225419.html
总结
以上是ag凯发k8国际为你收集整理的asp.net mvc3 技术(二) webgrid 的使用方法的全部内容，希望文章能够帮你解决所遇到的问题。
- 上一篇：
- 下一篇：