绑定列表列表的正确方法

时间:2013-08-14 15:34:58

标签: asp.net-mvc asp.net-mvc-4

我正在推出一个包含自定义字段分组的动态表单

因此,在我的主Form(Form)对象上,我有一个分组列表(Group),这些分组各有一个自定义字段列表(Field),分组主要用于将自定义字段显示为带标题的列等

我的问题是,对于每个新的分组,我显示自定义字段的计数器重置并返回到0,这意味着当发送回我的控制器的数据时,事情不能正确发布,因为有重复的名称属性。

我目前正在回复一个字段列表,因为我不需要回发分组。

有没有人能以不同的方式解决这个问题?这显然我做错了?

在下面的示例代码中,为此表单生成的HTML为我提供了4个输入控件,但只有两个唯一的控件名称,例如:两个控件有“name =”group.Fields [0] .Result“”表示name属性,另外两个有“name =”group.Fields [1] .Result“”,当发回给控制器时显然不行。

编辑:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using FieldsPoC.Models;

namespace FieldsPoC.Controllers
{
    public class FormController : Controller
    {
        public ActionResult Index()
        {
            FormViewModel model = new FormViewModel();

            var group = new GroupViewModel();
            group.Label = "Group 1";
            group.Fields.Add(new FieldViewModel() { Label = "Field 1", Type = FieldType.Number });
            group.Fields.Add(new FieldViewModel() { Label = "Field 2", Type = FieldType.Text });
            model.Groups.Add(group);

            group = new GroupViewModel();
            group.Label = "Group 2";
            group.Fields.Add(new FieldViewModel() { Label = "Field 1", Type = FieldType.DateTime });
            group.Fields.Add(new FieldViewModel() { Label = "Field 2", Type = FieldType.Number });
            model.Groups.Add(group);

            return View(model);
        }

        [HttpPost]
        public ActionResult Index([Bind(Prefix = "Contact")]ContactViewModel contact, List<GroupViewModel> fields)
        {

            return View();
        }
    }
}

namespace FieldsPoC.Models
{
    public class ContactViewModel
    {
        public string FirstName { get; set; }
        public string LastName { get; set; }
    }
}

namespace FieldsPoC.Models
{
    public class ContactViewModel
    {
        public string FirstName { get; set; }
        public string LastName { get; set; }
    }
}

namespace FieldsPoC.Models
{
    public class GroupViewModel
    {
        public GroupViewModel()
        {
            Fields = new List<FieldViewModel>();
        }

        // Other layout properties
        public string Label { get; set; }
        public List<FieldViewModel> Fields { get; set; }
    }
}

namespace FieldsPoC.Models
{
    public enum FieldType
    {
        Text = 0,
        Number = 1,
        DateTime = 2
    }

    public class FieldViewModel
    {
        public FieldType Type { get; set; }
        public string Label { get; set; }
        public string Result { get; set; }
    }
}

FormIndex:

@model FieldsPoC.Models.FormViewModel
@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <div>
        @using (Html.BeginForm("", "Form"))
        {
            @Html.ValidationSummary(true)

            @Html.EditorFor(model => model.Contact)

            foreach (var group in Model.Groups)
            {
            @Html.EditorFor(x => group);
            }

            <p>
                <input type="submit" value="Save" />
            </p>
        }
    </div>
</body>
</html>

EditorTemplates:

@model FieldsPoC.Models.ContactViewModel
<div class="editor-label">
    @Html.LabelFor(model => model.FirstName)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.FirstName)
    @Html.ValidationMessageFor(model => model.FirstName)
</div>
<div class="editor-label">
    @Html.LabelFor(model => model.LastName)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.LastName)
    @Html.ValidationMessageFor(model => model.LastName)
</div>

@model FieldsPoC.Models.FieldViewModel
<div class="editor-label">
   @Model.Label
</div>

@{ 
    switch (Model.Type)
    {
        case FieldsPoC.Models.FieldType.DateTime:
            @Html.TextBoxFor(model => model.Result);
            break;
        case FieldsPoC.Models.FieldType.Number:
            @Html.TextBoxFor(model => model.Result);
            break;
        case FieldsPoC.Models.FieldType.Text:
            @Html.TextBoxFor(model => model.Result);
            break;
    }
}

@model FieldsPoC.Models.GroupViewModel
<fieldset>
    <legend>@Model.Label</legend>
    @Html.EditorFor(model => model.Fields)
</fieldset>

标题

0 个答案:

没有答案