在c＃MVC分组单选按钮(Grouping radio buttons in c# mvc)

我有我显示菜单的形式。每个菜单有一个部分和选择如下：

Starters

Prawn Cocktail 
Soup

Mains

Beef
Lamb

我通过菜单章节和菜单选项对于部分循环，每个菜单选项，我希望有一个单选按钮，然后将它们分组每节在一起，这样只有一个菜单选项可以每节选择。默认情况下，先头的选择将被选中。这是我到目前为止

在模型

public List<MenuCourses> courses {get; set;}
public List<MenuOptions> options {get;set;}

并在视图

@for ( int i = 0; i < Model.MenuCourses.Count(); i++ ){

      @Html.DisplayFor(m=> m.MenuCourses[i].CourseTitle )

      // loop options
      for ( int k = 0; k < Model.MenuOptions.Count(); k++ ){

          if(Model.MenuOptions[k].MenuCoursesID == Model.MenuCourses[i].MenuCoursesID){

             @Html.DisplayFor(m=> 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<Option> Options{ set; get; }
    public int SelectedAnswer { set; get; }
    public Course()
    {
        Options= new List<Option>();
    }
}
public class Option
{
    public int ID { set; get; }
    public string Title { set; get; }
}
public class OrderViewModel 
{
    public List<Course> Courses{ set; get; }
    public OrderViewModel()
    {
        Courses= new List<Course>();
    }
}

在我们的GET的视图操作方法，我们将创建OrderViewModel类的一个对象，并设置课程集合，它的选项属性，然后发送到视图通过将其传递到视图的方法。

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
<div>
    @Html.HiddenFor(x=>x.ID)
    <h3> @Model.Name</h3>
    @foreach (var a in Model.Options)
    {
       <p>
          @Html.RadioButtonFor(b=>b.SelectedAnswer,a.ID)  @a.Title
       </p>
    }
</div>

现在去主视图，并使用EditorFor HTML辅助方法带来的editortemplate

@model OrderViewModel 
<h2>Your Order</h2>
@using (Html.BeginForm())
{
    @Html.EditorFor(x=>x.Courses)
    <input type="submit" />
}

要获得形式选定的项目提交，你可以这样做

[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);
}

这是在清楚地解释这个博客帖子，使用它可以下载并运行自己，看看它是如何工作的一个工作示例。