在看看两个view的完整代码：
aspx：
<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<List<WebGridAspx.Models.Products>>" %>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
产品列表
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<script type="text/javascript">
function deleteRecord(a, b)
{
alert("删除:"+b);
}
</script>
<h2>产品列表</h2>
<div id="grid">
<% var grid = new WebGrid(source: Model, defaultSort: "ProductName", rowsPerPage: 5); %>
<%=grid.GetHtml(
tableStyle: "grid", headerStyle: "head", alternatingRowStyle: "alt",
columns: grid.Columns(
grid.Column(format: (item) => Html.ActionLink("Edit", "Edit", new
{
id = item.ProductID
}
)),
grid.Column(format: (item) => Html.ActionLink("Delete", "Delete", null, new
{
onclick = string.Format("deleteRecord('Employee', '{0}')",
item.ProductID), @class = "Delete",
href = "JavaScript:void(0)"
}
)),
grid.Column("ProductName","产品名称"),
grid.Column("QuantityPerUnit","每单位数量"),
grid.Column("UnitPrice","单价"), grid.Column("UnitsInStock", "库存单位"),
grid.Column("UnitsOnOrder","订单单位"),
grid.Column("ReorderLevel","重新排序级别"),
grid.Column("Discontinued","已停产")
)
) %>
</div>
</asp:Content>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
产品列表
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<script type="text/javascript">
function deleteRecord(a, b)
{
alert("删除:"+b);
}
</script>
<h2>产品列表</h2>
<div id="grid">
<% var grid = new WebGrid(source: Model, defaultSort: "ProductName", rowsPerPage: 5); %>
<%=grid.GetHtml(
tableStyle: "grid", headerStyle: "head", alternatingRowStyle: "alt",
columns: grid.Columns(
grid.Column(format: (item) => Html.ActionLink("Edit", "Edit", new
{
id = item.ProductID
}
)),
grid.Column(format: (item) => Html.ActionLink("Delete", "Delete", null, new
{
onclick = string.Format("deleteRecord('Employee', '{0}')",
item.ProductID), @class = "Delete",
href = "JavaScript:void(0)"
}
)),
grid.Column("ProductName","产品名称"),
grid.Column("QuantityPerUnit","每单位数量"),
grid.Column("UnitPrice","单价"), grid.Column("UnitsInStock", "库存单位"),
grid.Column("UnitsOnOrder","订单单位"),
grid.Column("ReorderLevel","重新排序级别"),
grid.Column("Discontinued","已停产")
)
) %>
</div>
</asp:Content>
Razor：
@model List<WebGridRazor.Models.Products>
@{
View.Title = "产品列表";
}
<p>
<h2>产品列表</h2>
<div id="grid">
@{
var grid = new WebGrid(source: Model, defaultSort: "ProductName", rowsPerPage: 3);
}
@grid.GetHtml( tableStyle: "grid", headerStyle: "head", alternatingRowStyle: "alt",
columns: grid.Columns(
grid.Column(format: (item) => Html.ActionLink("Edit", "Edit", new { id = item.ProductID })),
grid.Column(format: (item) => Html.ActionLink("Delete", "Delete", null, new { onclick = string.Format("deleteRecord('Product', '{0}')", item.ProductID),
@class = "Delete",
href = "JavaScript:void(0)" })), grid.Column("ProductName","产品名称"), grid.Column("QuantityPerUnit","每单位数量"),
grid.Column("UnitPrice","单价"), grid.Column("UnitsInStock", "库存单位"),
grid.Column("UnitsOnOrder","订单单位"), grid.Column("ReorderLevel","重新排序级别"),
grid.Column("Discontinued","已停产")
)
) </div> </p>
@{
View.Title = "产品列表";
}
<p>
<h2>产品列表</h2>
<div id="grid">
@{
var grid = new WebGrid(source: Model, defaultSort: "ProductName", rowsPerPage: 3);
}
@grid.GetHtml( tableStyle: "grid", headerStyle: "head", alternatingRowStyle: "alt",
columns: grid.Columns(
grid.Column(format: (item) => Html.ActionLink("Edit", "Edit", new { id = item.ProductID })),
grid.Column(format: (item) => Html.ActionLink("Delete", "Delete", null, new { onclick = string.Format("deleteRecord('Product', '{0}')", item.ProductID),
@class = "Delete",
href = "JavaScript:void(0)" })), grid.Column("ProductName","产品名称"), grid.Column("QuantityPerUnit","每单位数量"),
grid.Column("UnitPrice","单价"), grid.Column("UnitsInStock", "库存单位"),
grid.Column("UnitsOnOrder","订单单位"), grid.Column("ReorderLevel","重新排序级别"),
grid.Column("Discontinued","已停产")
)
) </div> </p>
Razor去掉了那些模板页的代码，使代码看起来更整洁。比较喜欢Razor。
总结：本文很简单，介绍了一下ASP.NET MVC 3 Beta中新功能WebGrid，由于这种方式WebGrid是在内存中分页和排序的，所以不适合大数据量。
代码：http://files.cnblogs.com/zhuqil/MvcApplication11.rar
