16

我想在我的表单中显示一个单选按钮，该按钮将从模型数据中填充。

这是我的模型

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

我搜索了谷歌并找到了许多样本，我使用了一个但不确定它是否有效。这是视图中的单选按钮代码。

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

我不想硬编码男性或女性；我想通过模型展示它，并想在 for 循环中生成单选按钮。

我也是MVC新手，所以请指导我。

4

2 回答 2

35

如果我理解正确，您应该更改您的学生模型，以便将属性“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);
}
于 2013-09-17T20:54:09.657 回答
1

首先，创建枚举

public enum QuestionDetails
    {

        Description = 1,            
        Attachment = 2,           
        DescriptionandAttachment = 3        
    }

第二模型部分

    public class QuestionModel
      {
        public QuestionDetails answerFiledType { get; set; }

        public string answerFiledTypeValue
        {
            get { return answerFiledType.ToString(); }
            set { answerFiledType = ((QuestionDetails)Enum.Parse(typeof(QuestionDetails), value.ToUpper().ToString())); }
        }
}

剃刀：

 <label class="custom-control custom-radio">
                @Html.RadioButtonFor(m => m.answerFiledType, WM_GlobalLib.EnumHelper.QuestionDetails.Description, new { @name = "radio", @type = "radio",@id = "Description" })
                <span class="custom-control-indicator"></span>
                <span class="custom-control-description">Description</span>
            </label>
            <label class="custom-control custom-radio">
                @Html.RadioButtonFor(m => m.answerFiledType, WM_GlobalLib.EnumHelper.QuestionDetails.Attachment, new { @name = "radio", @type = "radio", @id = "Attachment" })
                <span class="custom-control-indicator"></span>
                <span class="custom-control-description">Attachment</span>
            </label>
            <label class="custom-control custom-radio">
                @Html.RadioButtonFor(m => m.answerFiledType, WM_GlobalLib.EnumHelper.QuestionDetails.DescriptionandAttachment, new { @name = "radio", @type = "radio",@id = "DescriptionandAttachment" })
                <span class="custom-control-indicator"></span>
                <span class="custom-control-description">DescriptionandAttachment</span>
            </label>

控制器部分：

现在您可以通过模型属性获取选定值的值，可以保存在数据库中，也可以编辑。

于 2018-06-11T11:03:12.510 回答