Как отобразить два частичных просмотра в одном представлении в MVC?

Question

Как отобразить два частичных вида в одном представлении? В моем контроллере у меня есть два метода, которые возвращают partialview. Я хочу, чтобы эти методы были объединены в одном представлении.

В моем контроллере у меня есть это:

public ActionResult CountCars() 
    {   
     var result = this.Data.Cars.All()      
      .Select(t => new CarsViewModel 
      { 
       CategoryName = t.Name, 
       CategoryCount = t.Category.Count() 
      }); 
     return PartialView("_ChooseCarsPartialViewLayout", result.ToList()); 
    } 

    public ActionResult ChooseCity() 
    { 
     var view = this.Data.Cities.All() 
      .Select(x => new CityViewModel 
      { 
       CityName = x.Name, 
       CountCities = x.City.Count() 
      }); 

     return PartialView("_ChooseCarsPartialViewLayout", view.ToList());     
    }  

_ChooseCarsPartialViewLayout

@model IEnumerable<Project.ViewModels.City.CityViewModel> <div class="container"> 
<div class="well"> 

    <div class="row"> 

     <div class="col-md-12"> 

      <div class="form-group"> 
       <h4>?</h4> 
       <div class="checkbox checkbox-primary"> 
        @for (int i = 0; i < Model.Count(); i++) 
        { 
         var cars = Model.ElementAt(i); 

         <label>@cars.CategoryName <span class="badge">@cars.CategoryCount</span></label> 
         @Html.RadioButton(cars.CategoryName, 
           cars.CategoryId, 
          new 
          { 
           id = "radio", 
           type = "checkbox" 

          }) 

        } 
       </div> 
      </div> 



      <div class="form-group"> 
       <h4>Hvor vil du jobbe?</h4> 
       <div class="checkbox checkbox-primary"> 
        @for (int i = 0; i < Model.Count(); i++) 
        { 
         var city = Model.ElementAt(i); 

         <label>@city.CityName <span class="badge">@city.CountCities</span></label> 
         @Html.RadioButton(city.CityName, 
          city.CityId, 
          new 
          { 
           id = "radio", 
           type = "checkbox" 

          }) 

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

И когда я бег решения он просто выводится сообщение об ошибке, что говорит.

Значение не может быть пустым или пустым. Имя параметра: имя

Линия 18: @ Html.RadioButton (cars.CategoryName,

Но если бы я имел два различных частичный вид, то он прекрасно работает, но я хочу, чтобы это в том же PartialView .

Также у меня есть этот Html.Action в _layout оказывать на partialviews

@Html.Action("ChooseCity", "Home") 

Любое предложение?

Answer 1

Поскольку у вас есть ViewModel называется CityViewModel (хотя я назову его RadiosVM Я хотел бы создать несколько шаблонов EditorFor.

Используйте композитную модель как user1672994 mentioned in his answer, хотя его можно сделать более универсальным и многоразовым. ViewModel должен инкапсулировать все (есть исключения) данные, необходимые для визуализации представления.

public class RadiosVM 
{ 
    public string Name { get; set; } 
    public IEnumerable<RadioVM> Radios { get; set; } 
} 

public class RadioVM 
{ 
    public string Name { get; set; } 
    public int Count { get; set; } 
} 

public class SomePageVM // whatever 
{ 
    public RadiosVM CarRadios { get; set; } 
    public RadiosVM CityRadios { get; set; } 

    // ... other properties 
} 

Не разворачивайте другой контроллер только для отображения модели (которая неэффективна), если только контроллер не выполняет действия, которые не имеют абсолютно никакого отношения к текущему контроллеру и/или вы планируете кэшировать это представление.

public class SomeController 
{ 

    public ActionResult SomePage() 
    { 
    var model = new SomePageVM(); 
    model.CarRadios = GetCarRadios; 
    model.CityRadios = GetCityRadios; 
    return View(model); 
    } 

    private RadiosVM GetCarRadios() 
    {   
    var result = new RadiosVM() 
    { 
     Name = "Cars", 
     Radios = this.Data.Cars.All()      
     .Select(t => new RadioVM 
     { 
      CategoryName = t.Name, 
      CategoryCount = t.Category.Count() 
     }) 
     .ToList(); 
    } 
     return result; 
    } 

    public RadiosVM ChooseCity() 
    { 
    var result = new RadiosVM() 
    { 
     Name = "Cars", 
     Radios = this.Data.Cities.All()      
     .Select(t => new RadioVM 
     { 
      CategoryName = t.Name, 
      CategoryCount = t.Category.Count() 
     }) 
     .ToList(); 
    } 
     return result; 
} 

Просмотров:

SomePage.cshtml

@Model SomePageVM 

<div class="well"> 

    <div class="row"> 

    <div class="col-md-12"> 
     @Html.EditorFor(m => m.CarRadios) 
    <div/> 

    <div class="col-md-12"> 
     @Html.EditorFor(m => m.CityRadios) 
    <div/> 

// ... 

/Views/Shared/EditorTemplates/RadiosVM.cshtml или /Views/SomeController/EditorTemplates/RadiosVM.cshtml

@Model RadiosVM 

<div class="form-group"> 
    <h4>@Html.DisplayFor(m => m.Name)</h4> 

    <div class="checkbox checkbox-primary"> 

    @Html.DisplayFor(m => m.Radios) 

</div> 

/Views/Shared/EditorTemplates/RadioVM.cshtml или /Views/SomeController/EditorTemplates/RadioVM.cshtml

@Model RadioVM 

<label>@Html.DisplayFor(m => m.Name) 
    <span class="badge">@Html.DisplayFor(m => m.Count)</span> 
</label> 
@Html.RadioButton(model.Name, 
    model.Id, // You have no code that references this, I don't know... 
    new 
    { 
    id = "radio", // so **ALL** radios are named 'id'?? not valid 
    type = "checkbox" 
    }) 

Answer 2

Проблема с моделью частичного представления, которая строго типизирована IEnumerable<Project.ViewModels.City.CityViewModel>, которая не содержит декларации CategoryName. Итак, вы должны создать композитную модель, которая вернет Cars и Citis для частичного просмотра.

public class CompositeModel 
{ 
    public IEnumerable<Project.ViewModels.City.CityViewModel> Cars { get; set; } 
    public IEnumerable<Project.ViewModels.City.CarsViewModel> Cities { get; set; } 
} 

Теперь изменить свой взгляд, как

@model CompositeModel 
<div class="container"> 
<div class="well"> 

    <div class="row"> 

     <div class="col-md-12"> 

      <div class="form-group"> 
       <h4>?</h4> 
       <div class="checkbox checkbox-primary"> 
        @for (int i = 0; i < Model.Cars.Count(); i++) 
        { 
         var cars = Model.Cars.ElementAt(i); 

         <label>@cars.CategoryName <span class="badge">@cars.CategoryCount</span></label> 
         @Html.RadioButton(cars.CategoryName, 
           cars.CategoryId, 
          new 
          { 
           id = "radio", 
           type = "checkbox" 

          }) 

        } 
       </div> 
      </div> 



      <div class="form-group"> 
       <h4>Hvor vil du jobbe?</h4> 
       <div class="checkbox checkbox-primary"> 
        @for (int i = 0; i < Model.Cities.Count(); i++) 
        { 
         var city = Model.Cities.ElementAt(i); 

         <label>@city.CityName <span class="badge">@city.CountCities</span></label> 
         @Html.RadioButton(city.CityName, 
          city.CityId, 
          new 
          { 
           id = "radio", 
           type = "checkbox" 

          }) 

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