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

回答

相關問題