在c＃mvc中对单选按钮进行分组
我有一个表单，我在其中显示菜单。 每个菜单都有一个部分和选项如下：
Starters Prawn Cocktail Soup Mains Beef Lamb 我正在循环浏览该部分的菜单部分和菜单选项，对于每个菜单选项，我想要一个单选按钮，并按部分将它们组合在一起，这样每个部分只能选择一个菜单选项。 默认情况下，将选择顶部选择。 这就是我到目前为止所拥有的
在模型中
public List courses {get; set;} public List options {get;set;}
并在视图中
@for ( int i = 0; i m.MenuCourses[i].CourseTitle ) // loop options for ( int k = 0; k m.MenuOptions[k].Title) //NEED RADIO BUTTON HERE BUT HOW DO I BIND TO THE MODEL? } }
我需要每个菜单选项都有一个分组到该部分的单选按钮，当用户点击保存时，我需要选择已选择的菜单选项。
任何帮助将不胜感激
提前致谢
您可以使用EditorTemplates执行此操作。
让我们为我们的场景创建3个视图模型。
public class Course { public int ID { set; get; } public string Name{ set; get; } public List
在我们的视图的GET操作方法中，我们将创建OrderViewModel类的对象并设置Course集合及其Options属性，然后通过将其传递给View方法将其发送到视图。
public ActionResult Index() { var vm= new OrderViewModel(); //the below is hard coded for DEMO. you may get the data from some //other place and set the course and options var q1 = new Course { ID = 1, Name= "Starters" }; q1.Options.Add(new Option{ ID = 12, Title = "Prawn Cocktail " }); q1.Options.Add(new Option{ ID = 13, Title = "Soup" }); vm.Courses.Add(q1); var q2 = new Course { ID = 1, Name= "Mains" }; q2.Options.Add(new Option{ ID = 42, Title = "Beef" }); q2.Options.Add(new Option{ ID = 43, Title = "Lamp" }); vm.Courses.Add(q2); return View(vm); }
现在转到~/Views/YourControllerName文件夹并创建一个名为EditorTemplates的文件夹。 在那里创建一个名为Course.cshtml的新视图。 将以下代码添加到该文件中
@model Course @Html.HiddenFor(x=>x.ID) @Model.Name
@foreach (var a in Model.Options) { @Html.RadioButtonFor(b=>b.SelectedAnswer,a.ID) @a.Title
}
现在转到主视图并使用EditorFor html helper方法来引入editortemplate
@model OrderViewModel Your Order
@using (Html.BeginForm()) { @Html.EditorFor(x=>x.Courses) }
要在表单提交上获取所选项目，您可以执行此操作
[HttpPost] public ActionResult Index(OrderViewModel model) { if (ModelState.IsValid) { foreach (var q in model.Courses) { var qId = q.ID; var selectedAnswer = q.SelectedAnswer; // Save the data } return RedirectToAction("ThankYou"); //PRG Pattern } //to do : reload courses and options on model. return View(model); }
这个博客文章中清楚地解释了这个问题 ，您可以下载并自行运行，看看它是如何工作的。