ASP.NET MVC绑定DropDownList和复选框ViewModel

我有一个巨大的工作机会发布表单，我想通过点击旁边的复选框来提高属性的优先级。ASP.NET MVC绑定DropDownList和复选框ViewModel

例如：

工资X

TeamSizeØ

SomeTechnology X

其中X是检查和O是没有的。

我遇到了一个问题，我需要一个下拉列表和旁边的复选框，然后将其绑定到viewModel。尽管如此，我仍然无法完成最后一步。

的HomeController

public ActionResult CandidateRegister() 
{ 
    CandidateRegisterViewModel viewModel = new CandidateRegisterViewModel(); 

    viewModel.SelectedEmploymentTypeViewModel = new SelectedEmploymentTypeViewModel() 
    { 
     EmploymentType = 
      new SelectList(
       Enum.GetValues(typeof(Enums.EmploymentType)).Cast<Enums.EmploymentType>().Select(v => new SelectListItem 
       { 
        Text = v.ToString(), 
        Value = ((int)v).ToString() 
       }).ToList(), "Value", "Text"), 
     Selected = false 
    }; 

    return View(viewModel); 
}

的ViewModels

public class CandidateRegisterViewModel 
{ 
     public SelectedEmploymentTypeViewModel SelectedEmploymentTypeViewModel { get; set; } 
}   

public class SelectedEmploymentTypeViewModel 
{ 
     public SelectList EmploymentType { get; set; } 
     public bool Selected { get; set; } 
     public int? SelectedEmployment { get; set; } 
}

EmploymentType枚举

public enum EmploymentType 
{ 
     [Display(Name = "Full Time")] 
     FullTime, 
     [Display(Name = "Part Time")] 
     PartTime, 
     Contract, 
     Internship, 
     Other 
}

CandidateRegister查看

@model SourceTreeITMatchmaking.Models.CandidateRegisterViewModel  

<div class="white-container sign-up-form"> 
@using (Html.BeginForm("CandidateRegister", "Candidates")) 
{ 
    <section> 
     <h6 class="bottom-line">Essentials:</h6> 

     <div class="row"> 
       <div class="col-sm-12"> 
        <div class="col-sm-7" style="padding-left: 0;"> 

         @Html.DropDownList("SelectedEmployment", Model.SelectedEmploymentTypeViewModel.EmploymentType) 
         @Html.CheckBox("Selected", Model.SelectedEmploymentTypeViewModel.Selected) 

        </div> 
       </div> 
      </div> 
    </section> 
</div> 

    <hr class="mt60"> 
    <div class="clearfix"> 
     <input type="submit" class="btn btn-default btn-large pull-right" value="Register candidate!"> 
    </div> 
}

这是我到目前为止所尝试的。然而，我想实现的是，我有一个我的EmploymentType枚举的下拉列表，它旁边的复选框，然后将其绑定到SelectedEmploymentTypeViewModel，以便我可以将它放入CandidateRegisterViewModel中（它具有许多其他属性，如Address等等）

我希望你能帮助我一点:)在此先感谢！

来源

2015-09-26 Sheil

使用强类型助手，以便绑定到模型 - “@ Html.DropDownListFor（m => m.SelectedEmploymentTypeViewModel.SelectedEmployment，Model.SelectedEmploymentTypeViewModel。EmploymentType）'和'@ Html.CheckBox（M => m.SelectedEmploymentTypeViewModel.Selected）' –

你也应该在EmploymentType'的'分配仔细看 - 所有你需要的是'的IEnumerable ' - 将它转换成' List <>'是没有意义的额外开销，然后通过使用'SelectList'构造函数将其转换为另一个'IEnumerable '更是如此:) –

您无法将其绑定到查看模型的原因是您的输入名称不正确。无论是将其更改为：

@Html.DropDownList("SelectedEmploymentTypeViewModel.SelectedEmployment", Model.SelectedEmploymentTypeViewModel.EmploymentType)

和

@Html.CheckBox("SelectedEmploymentTypeViewModel.Selected", Model.SelectedEmploymentTypeViewModel.Selected)

或者一个更好的解决办法是使用强类型的辅助方法：

<div class="row"> 
     <div class="col-sm-12"> 
      <div class="col-sm-7" style="padding-left: 0;"> 
       @Html.DropDownListFor(m=>m.SelectedEmploymentTypeViewModel.SelectedEmployment , Model.SelectedEmploymentTypeViewModel.EmploymentType) 

       @Html.CheckBoxFor(m=>m.SelectedEmploymentTypeViewModel.Selected) 

      </div> 
    </div> 
</div>

此外，如果你有多个嵌套模型你可以为它们创建编辑器模板：

@model SourceTreeITMatchmaking.Models.SelectedEmploymentTypeViewModel 

<section> 
<h6 class="bottom-line">Essentials:</h6> 
    <div class="row"> 
      <div class="col-sm-12"> 
       <div class="col-sm-7" style="padding-left: 0;"> 
        @Html.DropDownListFor(m=>m.SelectedEmployment , Model.EmploymentType)  
        @Html.CheckBoxFor(m=>m.Selected) 

       </div> 
     </div> 
    </div> 
</section>

保存在查看/共享/ EditorTemplates/SelectedEmploymentTypeViewModel.cshtml

，然后在主视图中您可以使用它们像这样：

@model SourceTreeITMatchmaking.Models.CandidateRegisterViewModel  

<div class="white-container sign-up-form"> 
@using (Html.BeginForm("CandidateRegister", "Candidates")) 
{ 
     @Html.EditorFor(m=>m.SelectedEmploymentTypeViewModel) 

    <hr class="mt60"> 
    <div class="clearfix"> 
     <input type="submit" class="btn btn-default btn-large pull-right" value="Register candidate!"> 
    </div> 
}

这样你就可以清理你的主查看和封装并重用编辑器模板，无论他们需要什么。

来源

2015-09-26 09:55:00

ASP.NET MVC绑定DropDownList和复选框ViewModel

回答

相关问题