更改剃须刀 asp.net 的复选框样式答案

【问题标题】：Change checkbox style for razor asp.net更改剃须刀 asp.net 的复选框样式
【发布时间】：2016-02-16 12:11:02
【问题描述】：

我是 ASP.NET 新手，遇到以下问题：

我正在使用此代码更改 CheckBox 并将标签绑定到它：

@Html.CheckBoxFor(m => m.RememberMe, new { @class = "css-checkbox", id=Html.NameFor(m => m.UserName)})
<label class = "css-checkbox" for="@Html.NameFor(m => m.UserName)"></label>
@Html.LabelFor(m => m.RememberMe)

为了能够从 CSS 中使用此代码：

input[type=checkbox].css-checkbox {
   position:absolute; 
   z-index:-1000; 
   left:-1000px; 
   overflow: hidden; 
   clip: rect(0 0 0 0); 
   height:1px; 
   width:1px; 
   margin:-1px; 
   padding:0; 
   border:0;
}

input[type=checkbox].css-checkbox + label.css-label {
   padding-left:55px;
   height:50px; 
   display:inline-block;
   line-height:50px;
   background-repeat:no-repeat;
   background-position: 0 0;
   font-size:50px;
   vertical-align:middle;
   cursor:pointer;
}

input[type=checkbox].css-checkbox:checked + label.css-label {
   background-position: 0 -50px;
}

label.css-label {
   background-image:url(http://csscheckbox.com/checkboxes/u/csscheckbox_306b54046314f79a72ea1d0abe22fb0e.png);
   -webkit-touch-callout: none;
   -webkit-user-select: none;
   -khtml-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
}

但不幸的是，这个错误出现了：

错误 12 System.Web.Mvc.HtmlHelper<MYNAMESPACE.Models.LogOnModel> 不包含 NameFor 的定义，并且找不到接受 System.Web.Mvc.HtmlHelper<MYNAMESPACE.Models.LogOnModel> 类型的第一个参数的扩展方法 NameFor（您是否缺少 using 指令或程序集引用？）*

我添加了这段代码：

namespace MYNAMESPACE
{    
    public static class HtmlExtensions
    {
        public static string NameFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression)
        {
            return htmlHelper.ViewContext.ViewData.TemplateInfo.GetFullHtmlFieldName(ExpressionHelper.GetExpressionText(expression));
        }

        public static string IdFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression)
        {
            return HtmlHelper.GenerateIdFromName(NameFor(htmlHelper, expression));
        }
    }
}

这个到 web.config

<pages>
      <namespaces>
        <add namespace="System.Web.Helpers" />
        <add namespace="System.Web.Mvc" />
        <add namespace="System.Web.Mvc.Ajax" />
        <add namespace="System.Web.Mvc.Html" />
        <add namespace="System.Web.Routing" />
        <add namespace="System.Web.WebPages"/>
        <add namespace="MYNAMESPACE"/>
      </namespaces>
</pages>

有谁知道为什么错误不断出现？或者也许有更简单的方法从复选框中删除边框？

【问题讨论】：

在@class = "css-checkbox",之后使用@id代替id
确保您已将using System.Web.Mvc.HtmlHelper; 放入您的类文件中
MVC 已经包含 IdFor() 和 NameFor() 方法 - 为什么要创建自己的方法？
而且你的 css 选择器将永远无法工作 - @CheckBoxFor() 生成 2 个元素 - <input type="checkbox" ... /> 和 <input type="hidden ... />
@StephenMuecke 当我收到错误提示“System.Web.Mvc.HtmlHelper'不包含'NameFor'的定义”并且css选择器来自这个生成器时，我添加了这些方法：csscheckbox.com are你确定他们不会工作吗？如果是这样，您知道任何工作的生成器吗？

标签： html asp.net asp.net-mvc razor

【解决方案1】：

NameFor() 和 IdFor() 来自 System.Web.Mvc.Html。
您无需在自己的命名空间中定义这些扩展。
只需在您的 cshtml 文件顶部添加 @using System.Web.Mvc.Html;。

【讨论】：