如何显示具有适当技能的剃须刀复选框,并在post方法中获取选中的复选框值?

时间:2015-02-20 07:33:29

标签: c# asp.net-mvc razor checkbox

我正在创建一个注册表单,其中包含以下详细信息:

FullName:Textbox
Email:Textbox
Skills:checkbox playing 
       checkbox dancing
       checkbox programming

我希望像这样显示我的视图。但是我遇到的问题只有我的复选框。

我的模特:

public class EmployeeModel
    {
        public int Id { get; set; }
        public string Fullname { get; set; }
        public List<SelectedSkillsModel> Skills { get; set; }
    } 

public class SelectedSkillsModel
    {
        public bool Selected { get; set; }
        public int Id { get; set; }
        public string Name { get; set; }
    }

我的控制器:

 public ActionResult Index()
        {
            var employeeModel = new EmployeeModel();
            employeeModel.Skills = GetSkills();
            return View(employeeModel);
        }


        private List<SelectedSkillsModel> GetSkills()
        {
            var Skills = new List<SelectedSkillsModel>();
            Skills.Add(new SelectedSkillsModel { Name = "Playing", Id = 1, Selected = false });
            Skills.Add(new SelectedSkillsModel { Name = "Dancing", Id = 2, Selected = false });
            Skills.Add(new SelectedSkillsModel { Name = "Music", Id = 3, Selected = false });
            Skills.Add(new SelectedSkillsModel { Name = "Programming", Id = 4, Selected = false });
            return Skills;
        }

这是我的观点:

<fieldset>
            <legend>EmployeeModel</legend>

            <div class="editor-label">
                @Html.LabelFor(model => model.Fullname)
            </div>
            <div class="editor-field">
                @Html.TextBoxFor(model => model.Fullname)
                @Html.ValidationMessageFor(model => model.Fullname)
            </div>

            <div class="editor-field">
                @Html.TextBoxFor(model => model.Email)
                @Html.ValidationMessageFor(model => model.Email)
            </div>

//What should i do here to display checkbox with appropraite skills???

            <div class="editor-label">
                @Html.LabelFor(model => model.Skills)
            </div>
            <div class="editor-field">
                @foreach (var item in Model.Skills)
              {
                  @Html.CheckBox();
              }
            </div>

当我提交我的注册表格时,我应该在我的EmployeeModel模型中获得Id,Selected和Name值的相应技能。

注意:我想使用Only Razor复选框

我该怎么做???

2 个答案:

答案 0 :(得分:1)

您必须使用Html.CheckBoxFor()使用bool Selected SelectedSkillsModel属性的Html.HiddenFor()属性并使用@for (int i = 0; i < Model.Skills.Count; i++) { @Html.CheckBoxFor(m => m.Skills[i].Selected , new { id = "sikll_" + i }) @Html.HiddenFor(m => m.Skills[i].Id) @Html.HiddenFor(m => m.Skills[i].Name) @Html.DisplayFor(m => m.Skills[i].Name) } 以这种方式发布技能ID:

{{1}}

答案 1 :(得分:1)

对于for

类型,您需要EditorTemplate循环或自定义SelectedSkillsModel

使用循环

for (int i = 0; i < Model.Skills.Count; i++)
{
  @Html.LabelFor(m => m.Skills[i].Selected)
  @Html.CheckBoxFor(m => m.Skills[i].Selected)
  @Html.HiddenFor(m => m.Skills[i].Id)
  ....
}

使用编辑器模板(/Views/Shared/EditorTemplates/SelectedSkillsModel.cshtml

@model SelectedSkillsModel
@Html.LabelFor(m => m.Selected)
@Html.CheckBoxFor(m => m.Selected)
@Html.HiddenFor(m => m.Id)

并在主视图中

@model EmployeeModel
....
@Html.EditorFor(m => m.Skills)