Asp.net-Mvc-3

如何在 ASP.Net MVC 中將單選按鈕與模型數據綁定?

  • November 15, 2018

我想在我的表單中顯示一個單選按鈕,該按鈕將從模型數據中填充。

這是我的模型

public class Student
   {
       [Required(ErrorMessage = "First Name Required")] // textboxes will show
       [Display(Name = "First Name :")]
       [StringLength(5, ErrorMessage = "First Name cannot be longer than 5 characters.")]
       public string FirstName { get; set; }

[Required(ErrorMessage = "Last Name Required")] // textboxes will show
       [Display(Name = "Last Name :")]
       [StringLength(5, ErrorMessage = "Last Name cannot be longer than 5 characters.")]
       public string LastName { get; set; }

[Required(ErrorMessage = "Sex Required")] // group of radio button will show
       [Display(Name = "Sex :")]
       public List<Sex> Sex { get; set; }

}

public class Sex
   {
       public string ID { get; set; }
       public string Type { get; set; }
   }

在這裡,我試圖從像這樣的操作方法手動填充學生模型

public ActionResult Index()
{
var student=  new Student 
{
   FirstName = "Rion",
   LastName = "Gomes",

   Sex= new List<Sex>
       {
           new Sex{ID="1" , Type = "Male"}, 
           new Sex{ID="2" , Type = "Female"}
       }    
}    
   return View(student);
}

現在我怎麼能生成一個單選按鈕,它display text in form Male & Female的值將具有ID

我搜尋了Google並找到了許多樣本,我使用了一個但不確定它是否有效。這是視圖中的單選按鈕程式碼。

@Html.RadioButtonFor(x => x.Sex, "Male")

我不想硬編碼男性或女性;我想通過模型展示它,並想在 for 循環中生成單選按鈕。

我也是MVC新手,所以請指導我。

如果我理解正確,您應該更改您的學生模型,以便將屬性“Sex”作為整數,然後您應該有另一個名為“SexList”的屬性來填充列表。此更改將允許您發布數據並檢索使用者選擇的性別。

如果您使用的是 Razor 視圖引擎,您應該執行以下操作:

@{ 
   foreach (var sex in Model.SexList)
   {
       <div>
           @Html.RadioButtonFor(model => model.Sex, new { id = "sex" + sex.ID })
           @Html.Label("sex" + sex.ID, sex.Type)
       </div>
   }
}

編輯:

你的模型應該是這樣的:

public class Student
{
   [Required(ErrorMessage = "First Name Required")] // textboxes will show
   [Display(Name = "First Name :")]
   [StringLength(5, ErrorMessage = "First Name cannot be longer than 5 characters.")]
   public string FirstName { get; set; }

   [Required(ErrorMessage = "Last Name Required")] // textboxes will show
   [Display(Name = "Last Name :")]
   [StringLength(5, ErrorMessage = "Last Name cannot be longer than 5 characters.")]
   public string LastName { get; set; }

   [Required(ErrorMessage = "Sex Required")]
   [Display(Name = "Sex :")]
   public Sex Gender { get; set; }

   public List<Sex> SexList { get; set; }

}

public class Sex
{
   public string ID {get;set;}
   public string Type {get;set;}
}

您在控制器中的操作:

[HttpGet]
public ActionResult Index()
{
   var student = new Student 
   {
       FirstName = "Rion",
       LastName = "Gomes",

       //I think the best way to populate this list is to call a service here.
       SexList = new List<Sex>
       {
           new Sex{ID="1" , Type = "Male"}, 
           new Sex{ID="2" , Type = "Female"}
       }    
   }    

   return View(student);
}

和視圖:

@Html.BeginForm()
{
   <div>
       @Html.LabelFor(model => model.FirstName)
       @Html.EditorFor(model => model.FirstName)
       @Html.ValidationMessageFor(model => model.FirstName)
   </div>
   <div>
       @Html.LabelFor(model => model.LastName)
       @Html.EditorFor(model => model.LastName)
       @Html.ValidationMessageFor(model => model.LastName)
   </div>
   @{ 
       foreach (var sex in Model.SexList)
       {
           <div>
               @Html.RadioButtonFor(model => model.Gender, new { id = "sex" + sex.ID })
               @Html.Label("sex" + sex.ID, sex.Type)
           </div>
       }
   }

   <input type="submit" value"Submit" />
}

並且您應該以這種方式在控制器中執行操作。這是送出要發布數據的地方:

[HttpPost]
public ActionResult Index(Student model)
{
   if (ModelState.IsValid)
   {
       //TODO: Save your model and redirect 
   }

   //Call the same service to initialize your model again (cause we didn't post the list of sexes)
   return View(model);
}

引用自:https://stackoverflow.com/questions/18852821