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

时间:2013-08-17 19:36:21

标签: c# html .net asp.net-mvc

我刚刚开始学习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语法,也会发生这种情况。查看页面的源代码只显示一个空的表单标记。

我在这里做错了什么?

2 个答案:

答案 0 :(得分:4)

您使用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)
}

但是,这将使所有TextBox彼此相邻而没有Label,并且没有用于验证消息的占位符。将View中的每个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。

答案 1 :(得分: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>
}

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