ASP.NET MVC привязка DropDownList и флажок к ViewModel

Question

У меня есть форма публикации вакансий для работы, и я хотел увеличить приоритет свойств, установив флажок рядом с ними.

Например:

Зарплата Х

TeamSize О

SomeTechnology Х

где X проверяется и О нет.

Я столкнулся с проблемой, когда мне нужно иметь раскрывающийся список и флажок рядом с ним, а затем привязать его к 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 и т. д.)

Надеюсь, вы могли бы мне немного помочь :) Спасибо заранее!

Answer 1

Причина, по которой вы не можете привязать ее для просмотра модели, заключается в неправильном вводе имени ввода. Либо изменить их:

@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> 

Сохранить его в Views/Shared/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> 
} 

Таким образом, вы будете иметь возможность очистки вашей основной просматривать и инкапсулировать и повторно использовать шаблоны редактора везде, где они нужны.