【问题标题】:How to use WebGrid in a cshtml view?如何在 cshtml 视图中使用 WebGrid?
【发布时间】:2012-06-18 01:04:03
【问题描述】:

我可以在任何控制器中使用WebGrid,例如:

var grid = new WebGrid(emailsFetched, columnNames);

为此,我必须在我的 ASP.NET MVC 项目中添加对 System.Web.Helpers 的引用。

但是当我尝试在 view 中直接使用这个网络网格时(以避免控制器中的实例化和其他设置),它会显示:The type or namespace 'WebGrid' cannot be found。好的,我也尝试在这里添加参考:

@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'.

这很奇怪...我已经在网上看到了足够多的示例,它们使用 WebGrid 并且不必在 cshtml 视图中声明任何内容...

你能告诉我如何解决这个问题吗?或者为什么我会遇到这个非常丑陋的问题?

【问题讨论】:

  • 您能否尝试我在下面的答案中给出的方法,让我知道它是否有效?在此先感谢...

标签: asp.net-mvc razor webgrid


【解决方案1】:

最后我注意到了这一点:

<assemblies> <add assembly="System.Web.Helpers, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" /> </assemblies>

必须添加到网络配置中,在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>

【讨论】:

    【解决方案2】:

    尝试按照之前在 ASP.NET MVC4 项目中测试过的以下步骤进行操作,没有任何问题。

    1)Visual Studio 中打开NuGet Package Manager 并搜索“microsoft-web-helper” 并安装。

    2) 安装后在您的解决方案中打开web.config 并将connectionStringName 参数更改为DefaultMembershipProviderDefaultRoleProvider ve DefaultSessionProvider(如果不这样做,您可能会遇到'在应用程序配置中未找到 DefaultConnection' 或连接字符串为空。”错误。

    3) 重建您的项目,然后在您的 razor 视图中使用如下类似的定义。

    注意:更改Html.ActionLinks中的“Title”“Controller”“Action”名称根据你的项目。

    查看:

    @{
    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
    )
    


    下面是Razor 中使用的css 类。如果您想使用您的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>
    }
    


    希望这会有所帮助...

    【讨论】:

      【解决方案3】:

      遇到了这个问题。不能真正相信,但我卸载了早期版本并从 Nuget 重新安装了最新版本的 Microsoft ASP.NET MVC4,一切都对我有用。希望这对其他人有帮助。尝试了所有解决方案,但这是唯一有效的方法。 http://forums.asp.net/t/1823940.aspx?MVC4+WebGrid+problem+in+View+Razor+

      【讨论】:

        猜你喜欢
        • 2017-02-16
        • 2021-11-10
        • 2016-07-15
        • 1970-01-01
        • 1970-01-01
        • 2017-10-10
        • 2021-06-19
        • 1970-01-01
        • 2021-02-14
        相关资源
        最近更新 更多