asp.net-mvc 如何在 cshtml 视图中使用 WebGrid？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11042556/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to use WebGrid in a cshtml view?
提问by Cristian Boariu
I am able to use WebGridin any controller like:
我可以在任何控制器中使用WebGrid，例如：
var grid = new WebGrid(emailsFetched, columnNames);
var grid = new WebGrid(emailsFetched, columnNames);
I had to add a reference in my ASP.NET MVC project to System.Web.Helpersfor this.
为此，我必须在我的 ASP.NET MVC 项目中添加一个引用System.Web.Helpers。
But when I try to use this web grid in viewdirectly (to avoid instantiation and other settings in controller) it says: The type or namespace 'WebGrid' cannot be found. Ok, I tried to add a reference here too:
但是，当我尝试直接在视图中使用此 Web 网格时（以避免实例化和控制器中的其他设置），它说：The type or namespace 'WebGrid' cannot be found. 好的，我也尝试在此处添加参考：
@using System.Web.Helpersbut this throws another issue:
@using System.Web.Helpers但这引发了另一个问题：
There is no build provider registered for the extension '.cshtml'. You can register one in the <compilation><buildProviders> section in the machine.config or web.config. Make sure is has a BuildProviderAppliesToAttribute attribute which includes the value 'Web' or 'All'.
There is no build provider registered for the extension '.cshtml'. You can register one in the <compilation><buildProviders> section in the machine.config or web.config. Make sure is has a BuildProviderAppliesToAttribute attribute which includes the value 'Web' or 'All'.
This is pretty strange... I've seen enough example on net which are using WebGrid and don't have to declare anything in the cshtml view...
这很奇怪......我在网上看到了足够多的例子，它们使用 WebGrid 并且不必在 cshtml 视图中声明任何内容......
Can you please tell me how to solve this? Or why I encounter this very ugly issue?
你能告诉我如何解决这个问题吗？或者为什么我会遇到这个非常丑陋的问题？
回答by Cristian Boariu
Finally I've been able to notice that this:
最后我已经能够注意到这一点：
<assemblies>
<add assembly="System.Web.Helpers, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
</assemblies>
<assemblies>
<add assembly="System.Web.Helpers, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
</assemblies>
has to be added in web config, under system.websection, withing compilationtags so it will look like:
必须添加到 web 配置中的system.web部分下，带有compilation标签，因此它看起来像：
<system.web>
<compilation debug="true" targetFramework="4.0">
<assemblies>
<add assembly="System.Web.Helpers, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
</assemblies>
</compilation>
</system.web>
回答by Murat Y?ld?z
Try to follow the steps below that had been tested before in an ASP.NET MVC4project without any problem.
尝试按照之前在ASP.NET MVC4项目中测试过的以下步骤没有任何问题。
1)Open NuGet Package Managerin Visual Studioand search “microsoft-web-helper”and install.
1）打开NuGet Package Manager在Visual Studio与搜索“微软网络助手”安装。
2)After installing it open web.configin your solution and change connectionStringNameparameter for DefaultMembershipProvider, DefaultRoleProviderve DefaultSessionProvider(if you do not, you might encounter 'DefaultConnection' was not found in the applications configuration or the connection string is empty.” error.
2）安装后，web.config在您的解决方案中打开并更改connectionStringName参数DefaultMembershipProvider，DefaultRoleProviderve DefaultSessionProvider（如果不这样做，您可能会遇到在应用程序配置中找不到'DefaultConnection'或连接字符串为空。”错误。
3)Rebuild your project and then use a smilar definition like below in your razor view.
3)重建您的项目，然后在您的剃刀视图中使用如下所示的类似定义。
Note:Change "Title", "Controller"and "Action"names in Html.ActionLinksaccording to your project.
注意：根据您的项目更改“Title”、“Controller”和“Action”名称Html.ActionLinks。
View:
看法：
@{
var grid = new System.Web.Helpers.WebGrid(
source: Model,
columnNames: new List<string>() { "Title" },
ajaxUpdateContainerId: "myGrid",
defaultSort: "Name",
canPage: true,
canSort: true,
rowsPerPage: 5
);
grid.SortDirection = SortDirection.Ascending;
}
@grid.GetHtml(
tableStyle: "table", /*your class name for this property*/
headerStyle: "webgrid-header",/*your class name for this property*/
footerStyle: "webgrid-footer", /*your class name for this property*/
rowStyle: "webgrid-row-style", /*your class name for this property*/
alternatingRowStyle: "webgrid-alternating-row",/*your class name...*/ selectedRowStyle: "webgrid-selected-row",/*your class name for this property*/
firstText: "<<",
lastText: ">>",
mode: WebGridPagerModes.All,
fillEmptyRows: true,
columns: grid.Columns(
grid.Column("ApplicantID", "No", style: "span1", canSort: true),
grid.Column("Name", "Name", style: "span2", canSort: true),
grid.Column("Surname", "Surname", style: "span2", canSort: true),
grid.Column("Organization", "Org.", style: "span2", canSort: true),
grid.Column("MeetingId", "Meeting", style: "span1", canSort: true),
//some format usage samples:
//grid.Column("Email", "e-mail", style: "span1", canSort: true, format: @<a href="mailto:@item.Email">@item.Email</a>),
//grid.Column("BirthDate", format: p=>p.BirthDate.ToShortDateString()),
//for using multiple Html.ActionLink in a column using Webgrid
grid.Column("Operations", format: (item) =>
new HtmlString(
Html.ActionLink("Show Details", "Edit", "Admin", new
{
applicantId = item.ApplicantID,
title = "Detail",
@class = "icon-link",
style = "background-image: url('../../Content/icons/detail.png')"
}, null).ToString() +
Html.ActionLink("Edit Record", "Edit", "Admin", new
{
applicantId = item.ApplicantID,
title = "Edit",
@class = "icon-link",
style = "background-image: url('../../Content/icons/edit.png')"
}, null).ToString() +
Html.ActionLink("Delete Record", "Edit", "Admin", new
{
applicantId = item.ApplicantID,
title = "Delete",
@class = "icon-link",
style = "background-image: url('../../Content/icons/delete.png')"
}, null).ToString()
)
)
),
numericLinksCount: 5
)
Here are the cssclasses below used in Razor. If you would like to use your cssdefinitions simply change style properties to that of yours (Some properties are optional as the ones in the Razor View).
下面是css使用下面的类Razor。如果您想使用您的css定义，只需将样式属性更改为您的样式属性（某些属性是可选的，如 中的属性Razor View）。
<style type="text/css">
.webgrid-operations { /*for limiting the width of Operations
menu used in the WebGrid*/
width: 65px;
}
.webgrid-header td {
text-align: left;
}
.webgrid-header th {
background-color: #EFEFEF;
margin-bottom: 2px;
}
.webgrid td {
padding-right: 15px;
}
.webgrid-footer td {
font-family: 'open_sanssemibold', sans-serif;
font-size: 1em;
text-align: right !important;
padding-right: 21px !important;
color: #000;
background-color: #EFEFEF;
}
.webgrid-footer td a {
text-align: right !important;
padding: 0 .4em 0 .4em;
font-size: .83em;
text-decoration: none;
color: #FFFFFF;
border: 1px solid #C0C0C0;
background-color: #808080;
}
.webgrid-footer td a:hover {
background-color: #6BBEC7;
}
.webgrid-footer td a.selected {
background-color: #f00;
color: #f00;
}
.webgrid a {
color: #fff;
}
.colRowButton {
width: 70px;
text-align: left;
}
.webgrid-row-style {
/*border-bottom: 1px solid #E8EEF4;*/
}
.webgrid-alternating-row td {
/*background-color: #f9f9f9;*/
}
.webgrid-selected-row {
/*font-weight: bold;*/
}
<style type="text/css">
a.icon-link {
background-color: transparent;
background-repeat: no-repeat;
background-position: 0px 0px;
border: none;
cursor: pointer;
width: 16px;
height: 16px;
margin-right: 8px;
vertical-align: middle;
}
.span5 {
width:380px
}
.span4 {
width:300px
}
.span3 {
width:220px
}
.span2 {
width:140px
}
.span1 {
width:60px
}
</style>
}
Hope this helps...
希望这可以帮助...
回答by Eds
Ran into this issue. Can't really take credit but I uninstalled earlier version and reinstalled latest version of Microsoft ASP.NET MVC4 from Nuget and things are working for me. Hope this helps someone else. Tried all the solutions, but this was the only thing that worked. http://forums.asp.net/t/1823940.aspx?MVC4+WebGrid+problem+in+View+Razor+
遇到了这个问题。不能真正相信，但我卸载了早期版本并从 Nuget 重新安装了最新版本的 Microsoft ASP.NET MVC4，事情对我有用。希望这对其他人有帮助。尝试了所有解决方案，但这是唯一有效的方法。http://forums.asp.net/t/1823940.aspx?MVC4+WebGrid+problem+in+View+Razor+
