使用编辑器模板合并联系人的单选按钮列表
Radio button list using editor templates for merging contacts
我正在尝试在 ASP.net MVC 5 中显示用于合并两个联系人的表单。
表单应如下所示,其中每一行包含一个由 2 个选项组成的单选按钮组:
表单显示得很好,无线电组也能正常工作(我可以 select 每个组)。但是,当模型回发到服务器时,Values
列表为空(未保留)。我想同时获得 selected id,当然还有控制器中的实际文本值。我更喜欢使用编辑器模板来做到这一点,如果可能的话,没有 for
循环。
当前结果(值=空):
编辑以回应评论:我不想再次重新获取控制器中的值,因为它会导致调用网络服务。我尝试了 HiddenFor
的一些变体,但没有结果。
我的模型看起来像这样:
public class Contact
{
public List<ContactRow> Rows { get; set; }
public Contact()
{
this.Rows = new List<ContactRow>();
this.Rows.Add(new ContactRow("First Name", "Homer", "Homie"));
this.Rows.Add(new ContactRow("Last Name", "Simpson", "Simson"));
this.Rows.Add(new ContactRow("Email", "mail1", "mail2"));
this.Rows.Add(new ContactRow("Company Phone", "Phone1", "Phone2"));
this.Rows.Add(new ContactRow("Mobile Phone", "Mobile1", "Mobile2"));
}
}
public class ContactRow
{
public int Selection { get; set; }
public string Label { get; set; }
public List<ValueSet> Values { get; set; }
public ContactRow(string Label, string LeftValue, string RightValue, int Selection = 0)
{
if (LeftValue== null) LeftValue= "";
if (RightValue== null) RightValue= "";
this.Label = Label;
this.Selection = Selection;
this.Values = new List<ValueSet>(2);
this.Values.Add(new ValueSet() { ID = 0, ValueText = LeftValue});
this.Values.Add(new ValueSet() { ID = 1, ValueText = RightValue});
}
public ContactRow() { }
}
public class ValueSet
{
public int ID { set; get; }
public string ValueText { set; get; }
}
控制器:
public ActionResult Index()
{
Contact model = new Contact();
return View(model);
}
public ActionResult MergeContacts(Contact model)
{
return RedirectToAction("Index");
}
以及观看次数:
Index.cshtml
@model RadioTest.Models.Contact
@{
ViewBag.Title = "Home Page";
}
@using (Html.BeginForm("MergeContacts", "Home", FormMethod.Post, new { encType = "multipart/form-data", id = "contactDetailsForm", name = "contactDetailsForm" }))
{
<div>
<table class="table" width="100%">
<tr>
<th style="text-align:left">Label</th>
@*<th style="text-align:right">R1</th>*@
<th style="text-align:left">
Left Value
</th>
@*<th style="text-align:right">R2</th>*@
<th style="text-align:left">
Right Value
</th>
</tr>
@Html.EditorFor(model => model.Rows)
</table>
<input type="submit" />
</div>
}
ContactRow 的编辑器模板:
ContactRow.cshtml
@model RadioTest.Models.ContactRow
<tr>
<td style="text-align:left">
@Html.DisplayFor(model => model.Label)
</td>
@foreach (var v in Model.Values)
{
<td style="text-align:left">
@Html.RadioButtonFor(model => model.Selection, v.ID) @v.ValueText
</td>
}
</tr>
@Html.HiddenFor(model => model.Label)
只需将您的 foreach 更改为 for:
@model MVCApp.Controllers.ContactRow
<tr>
<td style="text-align:left">
@Html.DisplayFor(model => model.Label)
</td>
@for (int i = 0; i < Model.Values.Count; i++)
{
<td style="text-align:left">
@Html.RadioButtonFor(model => model.Selection, Model.Values[i].ID) @Model.Values[i].ValueText
@Html.HiddenFor(model => Model.Values[i].ID)
@Html.HiddenFor(model => Model.Values[i].ValueText)
</td>
}
</tr>
@Html.HiddenFor(model => model.Label)
我正在尝试在 ASP.net MVC 5 中显示用于合并两个联系人的表单。 表单应如下所示,其中每一行包含一个由 2 个选项组成的单选按钮组:
表单显示得很好,无线电组也能正常工作(我可以 select 每个组)。但是,当模型回发到服务器时,Values
列表为空(未保留)。我想同时获得 selected id,当然还有控制器中的实际文本值。我更喜欢使用编辑器模板来做到这一点,如果可能的话,没有 for
循环。
当前结果(值=空):
编辑以回应评论:我不想再次重新获取控制器中的值,因为它会导致调用网络服务。我尝试了 HiddenFor
的一些变体,但没有结果。
我的模型看起来像这样:
public class Contact
{
public List<ContactRow> Rows { get; set; }
public Contact()
{
this.Rows = new List<ContactRow>();
this.Rows.Add(new ContactRow("First Name", "Homer", "Homie"));
this.Rows.Add(new ContactRow("Last Name", "Simpson", "Simson"));
this.Rows.Add(new ContactRow("Email", "mail1", "mail2"));
this.Rows.Add(new ContactRow("Company Phone", "Phone1", "Phone2"));
this.Rows.Add(new ContactRow("Mobile Phone", "Mobile1", "Mobile2"));
}
}
public class ContactRow
{
public int Selection { get; set; }
public string Label { get; set; }
public List<ValueSet> Values { get; set; }
public ContactRow(string Label, string LeftValue, string RightValue, int Selection = 0)
{
if (LeftValue== null) LeftValue= "";
if (RightValue== null) RightValue= "";
this.Label = Label;
this.Selection = Selection;
this.Values = new List<ValueSet>(2);
this.Values.Add(new ValueSet() { ID = 0, ValueText = LeftValue});
this.Values.Add(new ValueSet() { ID = 1, ValueText = RightValue});
}
public ContactRow() { }
}
public class ValueSet
{
public int ID { set; get; }
public string ValueText { set; get; }
}
控制器:
public ActionResult Index()
{
Contact model = new Contact();
return View(model);
}
public ActionResult MergeContacts(Contact model)
{
return RedirectToAction("Index");
}
以及观看次数:
Index.cshtml
@model RadioTest.Models.Contact
@{
ViewBag.Title = "Home Page";
}
@using (Html.BeginForm("MergeContacts", "Home", FormMethod.Post, new { encType = "multipart/form-data", id = "contactDetailsForm", name = "contactDetailsForm" }))
{
<div>
<table class="table" width="100%">
<tr>
<th style="text-align:left">Label</th>
@*<th style="text-align:right">R1</th>*@
<th style="text-align:left">
Left Value
</th>
@*<th style="text-align:right">R2</th>*@
<th style="text-align:left">
Right Value
</th>
</tr>
@Html.EditorFor(model => model.Rows)
</table>
<input type="submit" />
</div>
}
ContactRow 的编辑器模板:
ContactRow.cshtml
@model RadioTest.Models.ContactRow
<tr>
<td style="text-align:left">
@Html.DisplayFor(model => model.Label)
</td>
@foreach (var v in Model.Values)
{
<td style="text-align:left">
@Html.RadioButtonFor(model => model.Selection, v.ID) @v.ValueText
</td>
}
</tr>
@Html.HiddenFor(model => model.Label)
只需将您的 foreach 更改为 for:
@model MVCApp.Controllers.ContactRow
<tr>
<td style="text-align:left">
@Html.DisplayFor(model => model.Label)
</td>
@for (int i = 0; i < Model.Values.Count; i++)
{
<td style="text-align:left">
@Html.RadioButtonFor(model => model.Selection, Model.Values[i].ID) @Model.Values[i].ValueText
@Html.HiddenFor(model => Model.Values[i].ID)
@Html.HiddenFor(model => Model.Values[i].ValueText)
</td>
}
</tr>
@Html.HiddenFor(model => model.Label)