Question

我已经完成了一个基本的教程，可以在一个简单的html页面中使用bootstrap工作，而且一切都很棒。我去了http://getbootstrap.com/customize/并下载了文件并创建了一个js，fonts和css文件夹，其中包含放在我的根目录中的正确文件。一旦我完成所有工作，我决定创建一个MVC版本，所以我创建了一个Basic MVC4应用程序，并将相同的文件夹和内容添加到我的Visual Studio解决方案中。我将一些html内容（如页眉和页脚）放入_Layout.cshtml文件并运行应用程序，一切看起来都很棒。

接下来我决定从Bootstrap示例页面创建一个简单的示例，所以我将以下内容添加到我的Index.cshtml页面

@using BootstrapTest.Models

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

@using (var f = Html.Bootstrap().Begin(new Form().LabelWidthMd(2).LabelWidthSm(3)))
{
    @f.FormGroup().TextBoxFor(m => m.Email)
    @f.FormGroup().TextBoxFor(m => m.Password)
    @f.FormGroup().CheckBoxFor(m => m.RememberMe)
    @f.FormGroup().CustomControls(Html.Bootstrap().SubmitButton())
}

当我运行应用程序时，我收到以下错误：System.Web.Mvc.HtmlHelper不包含Bootstrap的定义。我不知道如何解决这个问题。是否需要添加到页面顶部或web.config中的指令？

Answer 1

您尝试用来编写输入的HTML帮助程序来自Bootstrap 不。

它们来自TwitterBootstrapMVC库，这是一个.NET库，可以使用bootstrap轻松编写干净的HTML。

如果您尝试使用没有此库的常见Bootstrap，则必须编写如下HTML标记：

<form action="/" class="form-horizontal" method="post">
  <div class="form-group">
    <label class="control-label col-sm-3 col-md-2" for="Email">
      Email
      <span class="required">*</span>
    </label>
    <div class="col-sm-9 col-md-10">
      <input class="form-control" id="Email" name="Email" type="text" value="">
      <span class="help-inline">
        <span class="field-validation-valid" data-valmsg-for="Email"></span>
      </span>
    </div>
  </div>
  <div class="form-group">
    <label class="control-label col-sm-3 col-md-2" for="Password">
      Password
      <span class="required">*</span>
    </label>
    <div class="col-sm-9 col-md-10">
      <input class="form-control" id="Password" name="Password" type="text" value="">
      <span class="help-inline">
        <span class="field-validation-valid" data-valmsg-for="Password"></span>
      </span>
    </div>
  </div>
  <div class="form-group">
    <div class="control-label col-sm-3 col-md-2"></div>
    <div class="col-sm-9 col-md-10">
      <div class="checkbox">
        <label for="RememberMe">
          <input id="RememberMe" name="RememberMe" type="checkbox" value="true">
          <input name="RememberMe" type="hidden" value="false">
          Remember Me
          <span class="required">*</span>
          <span class="help-inline">
            <span class="field-validation-valid" data-valmsg-for="RememberMe"></span>
          </span>
        </label>
      </div>
    </div>
  </div>
  <div class="form-group">
    <span class="control-label col-sm-3 col-md-2"></span>
    <div class="col-sm-9 col-md-10">
      <button class="btn-default  btn" type="submit">Submit</button>
    </div>
  </div>
</form>

引导MVC应用程序

1 个答案: