使用 Html.BeginForm 呈现表单时不显示文本框

Question

我刚刚开始学习 ASP MVC 4，我正在做一个基本练习，这是一个图书托管网站。

我目前正在开发用于将新书添加到存储库的控制器。相应操作的视图被强类型化为Book 类作为其模型。 Book 是一个非常简单的模型，由标题、作者等组成。

我的AddBook 控制器目前看起来像这样：（我还没有在 POST 上实现任何数据库插入逻辑）

public class AddBookController : Controller
{
    [HttpGet]
    public ActionResult AddBook()
    {
        return View();
    }

    [HttpPost]
    public ActionResult AddBook(Book book)
    {
        return View();
    }

}

我的看法也很简单：

@model Bookshare.Models.Book

@{
    ViewBag.Title = "AddBook";
}

Add a new book
@using (Html.BeginForm())
{
    Html.TextBoxFor(model => model.Title);
    Html.TextBoxFor(model => model.Author);
    Html.TextBoxFor(model => model.PublishingCompany);
    Html.TextBoxFor(model => model.ReleaseYear);
    Html.TextBoxFor(model => model.Summary);
}

然而，当我调用此操作时，我只能看到“添加新书”标题和表单的提交按钮。没有任何文本框。如果我使用普通的旧 Html.TextBox 语法，也会发生这种情况。查看页面的源代码只会显示一个空的表单标签。

我在这里做错了什么？

Answer 1

您使用 Html Helper 的方式是错误的。 TextBoxFor 方法不是像 Html.TextBoxFor(...); 那样调用的 void 方法。它返回您要在页面上写入的MvcHtmlString 对象。因此，您可以像下面这样使用它：

@Html.TextBoxFor(model => model.Title)   

上述代码中的@ 相当于经典asp 中的Response.Write。

所以，您的表单最简单的方式应该是这样的：

@using (Html.BeginForm())
{
    @Html.TextBoxFor(model => model.Title)
    @Html.TextBoxFor(model => model.Author)
    @Html.TextBoxFor(model => model.PublishingCompany)
    @Html.TextBoxFor(model => model.ReleaseYear)
    @Html.TextBoxFor(model => model.Summary)
}

但是，这将使所有文本框彼此相邻，没有标签，也没有用于验证消息的占位符。将 View 中的每个 TextBox 替换为如下所示的内容，以便在页面上正确设置它们的格式并添加标签和验证消息占位符。

<div class="editor-label">
    @Html.LabelFor(model => model.Title)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.Title)
    @Html.ValidationMessageFor(model => model.Title)
</div>

EditorFor 将呈现为字符串属性的 TextBox。

Answer 2

事实证明，对于正确的形式，您只需要以下内容。 create 方法的控制器可以是这样的：

    public ActionResult Create()
    {
        return View();
    }

我的工作视图是这样的，你的领域当然会略有不同：

  @using (Html.BeginForm()) {
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>Book</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.Author)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Author)
            @Html.ValidationMessageFor(model => model.Author)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Title)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Title)
            @Html.ValidationMessageFor(model => model.Title)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Description)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Description)
            @Html.ValidationMessageFor(model => model.Description)
        </div>

        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}

有了这个，我可以看到浏览器中呈现的表单。