【问题标题】:Bootstrap MVC 4 TextBoxFor Required indicatorBootstrap MVC 4 TextBoxFor 必需指标
【发布时间】:2014-01-25 23:53:38
【问题描述】:

我完全糊涂了。我在注册页面的页面上有 6 个输入。其中三个盒子的右侧有所需的指示器,而其他三个则没有。代码中所有 6 个字段都是必需的。

我查看了代码,MVC 正在添加背景图像,或者 Bootstrap 正在添加。 这是我正在使用的 Razor 代码。

 <div class="row ">
            <div class="col-md-6">
                <div class="row">
                    @Html.TextBoxFor(m => m.currentUser.UserName, new { @class = "form-control", placeholder = "user name", tabindex = 1 })

                </div>

                <div class="row">
                    @Html.PasswordFor(m => m.currentUser.Password, new { @class = "form-control", placeholder = "password", tabindex = 3 })

                </div>
                <div class="row">
                    @Html.TextBoxFor(m => m.currentUser.LastName, new { @class = "form-control", placeholder = "last name", tabindex = 6 })

                </div>
            </div>
            <div class="col-md-6">
                <div class="row">
                    @Html.TextBoxFor(m => m.currentUser.EmailAddress, new { @class = "form-control", placeholder = "email address", tabindex = 2 })
                </div>
                <div class="row">
                    @Html.PasswordFor(m => m.confrimPassword, new { @class = "form-control", placeholder = "confirm password", tabindex = 4 })

                </div>
                <div class="row">
                    @Html.TextBoxFor(m => m.currentUser.FirstName, new { @class = "form-control", placeholder = "first name", tabindex = 5 })

                </div>
            </div>
        </div>

我在 Bootstrap 方面没有太多经验,所以我不确定这是导致问题的原因还是 MVC 是。

感谢任何帮助。

这是模型类:

 public class User
{
    public int ID { get; set; }

    [Required(ErrorMessage = "Please enter a User Name.")]
    public string UserName { get; set; }

    [Required(ErrorMessage = "Please enter a password")]
    public string Password { get; set; }

    [Required(ErrorMessage = "Please enter your first name.")]
    public string FirstName { get; set; }

    [Required(ErrorMessage = "Please enter your last name.")]
    public string LastName { get; set; }

    [Required(ErrorMessage = "Please enter an email address.")]
    public string EmailAddress { get; set; }
}

这是为具有指示器的输入生成的代码:

<input class="form-control" data-val="true" data-val-required="Please enter a password" id="currentUser_Password" name="currentUser.Password" placeholder="password" tabindex="3" type="password" autocomplete="off" keyev="true" clickev="true" style="background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAASCAYAAABSO15qAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3QsPDhss3LcOZQAAAU5JREFUOMvdkzFLA0EQhd/bO7iIYmklaCUopLAQA6KNaawt9BeIgnUwLHPJRchfEBR7CyGWgiDY2SlIQBT/gDaCoGDudiy8SLwkBiwz1c7y+GZ25i0wnFEqlSZFZKGdi8iiiOR7aU32QkR2c7ncPcljAARAkgckb8IwrGf1fg/oJ8lRAHkR2VDVmOQ8AKjqY1bMHgCGYXhFchnAg6omJGcBXEZRtNoXYK2dMsaMt1qtD9/3p40x5yS9tHICYF1Vn0mOxXH8Uq/Xb389wff9PQDbQRB0t/QNOiPZ1h4B2MoO0fxnYz8dOOcOVbWhqq8kJzzPa3RAXZIkawCenHMjJN/+GiIqlcoFgKKq3pEMAMwAuCa5VK1W3SAfbAIopum+cy5KzwXn3M5AI6XVYlVt1mq1U8/zTlS1CeC9j2+6o1wuz1lrVzpWXLDWTg3pz/0CQnd2Jos49xUAAAAASUVORK5CYII=); padding-right: 0px; background-attachment: scroll; cursor: auto; background-position: 100% 50%; background-repeat: no-repeat no-repeat;">

真正奇怪的是我发现它们出现在 Chrome 而不是 Firefox 中。

【问题讨论】:

  • 我不明白你为什么会这样,但它似乎是一个字形,尝试在你的代码中查找这个字形 glyphicon-asterisk
  • 不是我不信任你,而是你可以发布你的模型类并发布生成的 HTML 而不仅仅是 razor 模板。
  • 您有哪些 Chrome 扩展程序?尝试在没有任何扩展名的情况下检查您的网站。因为像 LastPass 这样的扩展往往会标记输入字段...
  • 会不会是“confrimPassword”引入了一个错误,会破坏引导程序插入“*”?渲染页面时 chrome 控制台中的任何错误?
  • 我不认为它是 Bootstrap 字形图标 - 其中有一条额外的线(8 分而不是 6 分)。

标签: css asp.net-mvc asp.net-mvc-4 twitter-bootstrap


【解决方案1】:

@nemesv - 你完全正确。 LastPass 是我在 Chrome 中安装的扩展程序之一。一旦我禁用它,图标就会被删除。几天来一直拉着我的头发试图弄清楚那个。

【讨论】:

  • 是的,这不是 MVC 或引导程序。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-01-19
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多