我正在推出一个包含自定义字段分组的动态表单
因此,在我的主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>