7

我很难清楚地说明我遇到的问题。我试图了解如何在验证失败后在循环中创建的表单字段中保留值。我有一个更复杂的现实世界表单,其中包含在循环和验证中创建的一堆元素。我已将其简化为下面包含的一个简单示例。

当验证失败时,我希望在循环中创建的名为“Comment”的文本区域保留下面预提交图像中显示的值。

当我调试表单提交时,每个字段的值都成功连接到模型中名为 Comment 的 IList 变量。这就是我想要的,所以我可以循环并根据索引定位它们。

提交后,循环生成的每个文本区域都会显示模型中 IList 变量 Comment 的逗号分隔表示。视图和模型中的字段似乎是连接的,因为它们共享一个名称。它们在进入的过程中正确连接,但在退出的过程中却没有。我希望视图仅显示与 Comment[i] 关联的值,而不是整个列表,以便在表单提交之间值保持不变。第一次加载

下方的屏幕截图和示例代码: 预提交表单更改:第一次提交后看到的表单:第二次提交后看到的表单:模型代码

首次加载表单而不进行更改


提交前对第一个输入进行更改的表单


第一次提交后的表格


在此处输入图像描述


using System.Collections.Generic;
namespace UI.Models.Forms
{
    public class TempListModel : ContentModel
    {
        public TempListModel()
        {
            Comment = new List<string>();
        }
        public IList<string> Comment { get; set; }  //Comments for each URL in the list
    }
}


查看代码

@model UI.Models.Forms.TempListModel  
@using (Html.BeginForm("temptest", "Test", new { id = 1 }, FormMethod.Post, new { id = "listForm", name = "listForm" }))
{
    <ul>
        @for (int i = 0; i < Model.Comment.Count(); i++)
        {
            <li>
                <div class="llformlabel">
                    Notes:
                    <div>@Model.Comment[i]</div>
                    @Html.TextArea("Comment", Model.Comment[i], 4, 63, new { @id = "Comment_" + i, @title = "Comment" })</div>
            </li>
        }
    </ul>
    <input type="submit" value="Save Changes" />
}


控制器代码

using System.Collections.Generic;
using System.Web.Mvc;
using UI.Models.Forms;
namespace UI.Controllers
{
    public class TestController : Controller
    {
        [AcceptVerbs(HttpVerbs.Post)]
        public ActionResult TempTest(TempListModel model)
        {
            //This function executes after the user submits the form.
            //If server side validation fails then the user should be shown the form as it was when they submitted.
            //model.Comment = GetComments();  //In my real world example this comes from a database.
            if (true) //!ModelState.IsValid) //In my real world code this is a validation step that may fail
            {
                return View(model);
            }
        }
        [AcceptVerbs(HttpVerbs.Get)]
        public ActionResult TempTest(int? id)
        {
            //In the real world example there is a lot going on in this function.
            //It is used to load data from databases and set up the model to be displayed.
            var model = new TempListModel(); 
            model.Comment = GetComments();
            return View("TempTest", "TempLayout", model);
        }
        private static IList<string> GetComments()
        {
            //Simple sample function used for demo purposes.
            IList<string> comments = new List<string>();
            comments.Add("Comment 1");
            comments.Add("Comment 2");
            comments.Add("Comment 3");
            return comments;
        }
    }
}
4

2 回答 2

8

如果验证失败,只需返回模型。

    [AcceptVerbs(HttpVerbs.Post)]
    public ActionResult TempTest(TempListModel model)
    {
        if (ModelState.IsValid)
        {
            return RedirectToAction("TempTest");
        }
        return View(model);
    }

编辑在您的视图中尝试此操作

@for (int i = 0; i < Model.Comment.Count(); i++)
{
    <li>
        @Html.TextAreaFor(m => m.Comment[i], 4, 63, new { @title = "Comment" })
    </li>
}

并让助手为您命名元素。你最终会得到nameComment[i].

于 2013-05-15T21:53:29.887 回答
2

ASP.NET MVC 默认 ModelBinder 在请求中查找与 TempListModel 属性匹配的 HTML 名称,以在服务器中重新构建模型。但是您正在覆盖每个 HTML 元素的注释 ID:

@Html.TextArea("Comment", Model.Comment[i], 4, 63, new { @id = "Comment_" + i, @title = "Comment" })

如果您需要放置此自定义 ID,则必须创建一个新的ModelBinder。你可以像这样让事情变得简单:

  @Html.TextAreaFor(m => m.Comment[i], 4, 63, new { @title = "Comment" })

希望对您有所帮助!

于 2013-05-15T22:54:35.267 回答