使用Html.BeginForm呈现表单时不显示TextBox

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方法Html.TextBoxFor(...); 。 它返回您要在页面上写入的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)
}

但是，这将使所有TextBox彼此相邻而没有Label，并且没有用于验证消息的占位符。 用以下内容替换视图中的每个TextBox，以在页面上正确格式化它们，并添加Label和Validation Message占位符。

<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>
}

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