Mehrere Modelle in einer Ansicht

Ich möchte 2 Modelle in einer Ansicht haben. Die Seite enthält sowohl LoginViewModelund RegisterViewModel.

z.B

public class LoginViewModel
{
    public string Email { get; set; }
    public string Password { get; set; }
}

public class RegisterViewModel
{
    public string Name { get; set; }
    public string Email { get; set; }
    public string Password { get; set; }
}

Muss ich ein anderes ViewModel erstellen, das diese 2 ViewModels enthält?

public BigViewModel
{
    public LoginViewModel LoginViewModel{get; set;}
    public RegisterViewModel RegisterViewModel {get; set;}
}

Ich möchte, dass die Validierungsattribute in die Ansicht übernommen werden. Deshalb brauche ich die ViewModels.

Gibt es nicht einen anderen Weg wie (ohne BigViewModel):

 @model ViewModel.RegisterViewModel
 @using (Html.BeginForm("Login", "Auth", FormMethod.Post))
 {
        @Html.TextBoxFor(model => model.Name)
        @Html.TextBoxFor(model => model.Email)
        @Html.PasswordFor(model => model.Password)
 }

 @model ViewModel.LoginViewModel
 @using (Html.BeginForm("Login", "Auth", FormMethod.Post))
 {
        @Html.TextBoxFor(model => model.Email)
        @Html.PasswordFor(model => model.Password)
 }

Es gibt viele Möglichkeiten ...

1. Mit Ihrem BigViewModel machen Sie:

   @model BigViewModel    
   @using(Html.BeginForm()) {
       @Html.EditorFor(o => o.LoginViewModel.Email)
       ...
   }

2. Sie können 2 zusätzliche Ansichten erstellen

   Login.cshtml

   @model ViewModel.LoginViewModel
   @using (Html.BeginForm("Login", "Auth", FormMethod.Post))
   {
       @Html.TextBoxFor(model => model.Email)
       @Html.PasswordFor(model => model.Password)
   }

   und register.cshtml dasselbe

   Nach der Erstellung müssen Sie sie in der Hauptansicht rendern und ihnen das Ansichtsmodell / die Ansichtsdaten übergeben

   so könnte es sein:

   @{Html.RenderPartial("login", ViewBag.Login);}
   @{Html.RenderPartial("register", ViewBag.Register);}

   oder

   @{Html.RenderPartial("login", Model.LoginViewModel)}
   @{Html.RenderPartial("register", Model.RegisterViewModel)}

3. Die Verwendung von Ajax-Teilen Ihrer Website wird unabhängiger

4. iframes, aber wahrscheinlich ist dies nicht der Fall

Ich würde empfehlen, Html.RenderActionPartialViewResults zu verwenden, um dies zu erreichen. Sie können dieselben Daten anzeigen, aber jede Teilansicht verfügt weiterhin über ein einzelnes Ansichtsmodell, sodass keine erforderlich istBigViewModel

Ihre Ansicht enthält also ungefähr Folgendes:

@Html.RenderAction("Login")
@Html.RenderAction("Register")

Wo Login& Registersind beide Aktionen in Ihrem Controller wie folgt definiert:

public PartialViewResult Login( )
{
    return PartialView( "Login", new LoginViewModel() );
}

public PartialViewResult Register( )
{
    return PartialView( "Register", new RegisterViewModel() );
}

Das Login& Registerwäre dann ein Benutzersteuerelement, das sich entweder im aktuellen Ansichtsordner oder im freigegebenen Ordner befindet, und möchte Folgendes:

/Views/Shared/Login.cshtml: (oder /Views/MyView/Login.cshtml)

@model LoginViewModel
@using (Html.BeginForm("Login", "Auth", FormMethod.Post))
{
    @Html.TextBoxFor(model => model.Email)
    @Html.PasswordFor(model => model.Password)
}

/Views/Shared/Register.cshtml: (oder /Views/MyView/Register.cshtml)

@model ViewModel.RegisterViewModel
@using (Html.BeginForm("Login", "Auth", FormMethod.Post))
{
    @Html.TextBoxFor(model => model.Name)
    @Html.TextBoxFor(model => model.Email)
    @Html.PasswordFor(model => model.Password)
}

Und dort haben Sie eine einzelne Controller-Aktion, Ansicht und Ansichtsdatei für jede Aktion, wobei jede Aktion völlig unterschiedlich ist und für nichts voneinander abhängig ist.

Ein anderer Weg ist zu verwenden:

@model Tuple<LoginViewModel,RegisterViewModel>

Ich habe für ein anderes Beispiel erklärt, wie diese Methode sowohl in der Ansicht als auch im Controller verwendet wird: Zwei Modelle in einer Ansicht in ASP MVC 3

In Ihrem Fall können Sie es mit dem folgenden Code implementieren:

In der Ansicht:

@using YourProjectNamespace.Models;
@model Tuple<LoginViewModel,RegisterViewModel>

@using (Html.BeginForm("Login1", "Auth", FormMethod.Post))
{
        @Html.TextBoxFor(tuple => tuple.Item2.Name, new {@Name="Name"})
        @Html.TextBoxFor(tuple => tuple.Item2.Email, new {@Name="Email"})
        @Html.PasswordFor(tuple => tuple.Item2.Password, new {@Name="Password"})
}

@using (Html.BeginForm("Login2", "Auth", FormMethod.Post))
{
        @Html.TextBoxFor(tuple => tuple.Item1.Email, new {@Name="Email"})
        @Html.PasswordFor(tuple => tuple.Item1.Password, new {@Name="Password"})
}

Beachten Sie, dass ich die Namensattribute für jede Eigenschaft beim Erstellen des Formulars manuell geändert habe. Dies muss durchgeführt werden, da es sonst nicht ordnungsgemäß dem Parameter des Methodenmodells der Methode zugeordnet wird, wenn Werte zur Verarbeitung an die zugehörige Methode gesendet werden. Ich würde vorschlagen, separate Methoden zu verwenden, um diese Formulare separat zu verarbeiten. In diesem Beispiel habe ich die Methoden Login1 und Login2 verwendet. Für die Login1-Methode muss ein Parameter vom Typ RegisterViewModel und für Login2 ein Parameter vom Typ LoginViewModel erforderlich sein.

Wenn ein Aktionslink erforderlich ist, können Sie Folgendes verwenden:

@Html.ActionLink("Edit", "Edit", new { id=Model.Item1.Id })

In der Methode des Controllers für die Ansicht muss eine Variable vom Typ Tuple erstellt und dann an die Ansicht übergeben werden.

Beispiel:

public ActionResult Details()
{
    var tuple = new Tuple<LoginViewModel, RegisterViewModel>(new LoginViewModel(),new RegisterViewModel());
    return View(tuple);
}

Oder Sie können die beiden Instanzen von LoginViewModel und RegisterViewModel mit Werten füllen und diese dann an die Ansicht übergeben.

Verwenden Sie ein Ansichtsmodell, das mehrere Ansichtsmodelle enthält:

   namespace MyProject.Web.ViewModels
   {
      public class UserViewModel
      {
          public UserDto User { get; set; }
          public ProductDto Product { get; set; }
          public AddressDto Address { get; set; }
      }
   }

Aus Ihrer Sicht:

  @model MyProject.Web.ViewModels.UserViewModel

  @Html.LabelFor(model => model.User.UserName)
  @Html.LabelFor(model => model.Product.ProductName)
  @Html.LabelFor(model => model.Address.StreetName)

Muss ich eine andere Ansicht erstellen, die diese beiden Ansichten enthält?

Antwort: Nein

Gibt es nicht einen anderen Weg wie (ohne das BigViewModel):

Ja , Sie können Tupel verwenden (bringt Magie in Sicht, wenn Sie mehrere Modelle haben).

Code:

 @model Tuple<LoginViewModel, RegisterViewModel>


    @using (Html.BeginForm("Login", "Auth", FormMethod.Post))
    {
     @Html.TextBoxFor(tuple=> tuple.Item.Name)
     @Html.TextBoxFor(tuple=> tuple.Item.Email)
     @Html.PasswordFor(tuple=> tuple.Item.Password)
    }


    @using (Html.BeginForm("Login", "Auth", FormMethod.Post))
     {
      @Html.TextBoxFor(tuple=> tuple.Item1.Email)
      @Html.PasswordFor(tuple=> tuple.Item1.Password)
     }

Fügen Sie diese ModelCollection.cs Ihren Modellen hinzu

using System;
using System.Collections.Generic;

namespace ModelContainer
{
  public class ModelCollection
  {
   private Dictionary<Type, object> models = new Dictionary<Type, object>();

   public void AddModel<T>(T t)
   {
      models.Add(t.GetType(), t);
   }

   public T GetModel<T>()
   {
     return (T)models[typeof(T)];
   }
 }
}

Regler:

public class SampleController : Controller
{
  public ActionResult Index()
  {
    var model1 = new Model1();
    var model2 = new Model2();
    var model3 = new Model3();

    // Do something

    var modelCollection = new ModelCollection();
    modelCollection.AddModel(model1);
    modelCollection.AddModel(model2);
    modelCollection.AddModel(model3);
    return View(modelCollection);
  }
}

Die Aussicht:

enter code here
@using Models
@model ModelCollection

@{
  ViewBag.Title = "Model1: " + ((Model.GetModel<Model1>()).Name);
}

<h2>Model2: @((Model.GetModel<Model2>()).Number</h2>

@((Model.GetModel<Model3>()).SomeProperty

ein einfacher Weg, das zu tun

Wir können alle Modelle zuerst aufrufen

@using project.Models

Dann senden Sie Ihr Modell mit Viewbag

// for list
ViewBag.Name = db.YourModel.ToList();

// for one
ViewBag.Name = db.YourModel.Find(id);

und im Blick

// for list
List<YourModel> Name = (List<YourModel>)ViewBag.Name ;

//for one
YourModel Name = (YourModel)ViewBag.Name ;

Verwenden Sie dann einfach dieses Modell

Mein Rat ist, ein großes Ansichtsmodell zu erstellen:

public BigViewModel
{
    public LoginViewModel LoginViewModel{get; set;}
    public RegisterViewModel RegisterViewModel {get; set;}
}

Wenn Sie in Ihrer Index.cshtml beispielsweise zwei Teiltöne haben:

@addTagHelper *,Microsoft.AspNetCore.Mvc.TagHelpers
@model .BigViewModel

@await Html.PartialAsync("_LoginViewPartial", Model.LoginViewModel)

@await Html.PartialAsync("_RegisterViewPartial ", Model.RegisterViewModel )

und im Controller:

model=new BigViewModel();
model.LoginViewModel=new LoginViewModel();
model.RegisterViewModel=new RegisterViewModel(); 

Ich möchte sagen, dass meine Lösung der Antwort auf dieser Stapelüberlaufseite entsprach: ASP.NET MVC 4, mehrere Modelle in einer Ansicht?

In meinem Fall funktionierte die in ihrem Controller verwendete Linq-Abfrage jedoch nicht für mich.

Dies ist die Abfrage:

var viewModels = 
        (from e in db.Engineers
         select new MyViewModel
         {
             Engineer = e,
             Elements = e.Elements,
         })
        .ToList();

Folglich hat "in Ihrer Ansicht nur angeben, dass Sie eine Sammlung von Ansichtsmodellen verwenden" auch bei mir nicht funktioniert.

Eine geringfügige Abweichung von dieser Lösung hat bei mir jedoch funktioniert. Hier ist meine Lösung für den Fall, dass dies jemandem hilft.

Hier ist mein Ansichtsmodell, in dem ich weiß, dass ich nur ein Team haben werde, aber dieses Team möglicherweise mehrere Boards hat (und ich habe übrigens einen ViewModels-Ordner in meinem Models-Ordner, daher der Namespace):

namespace TaskBoard.Models.ViewModels
{
    public class TeamBoards
    {
        public Team Team { get; set; }
        public List<Board> Boards { get; set; }
    }
}

Das ist mein Controller. Dies ist der bedeutendste Unterschied zur Lösung in dem oben genannten Link. Ich baue das ViewModel aus, um es anders an die Ansicht zu senden.

public ActionResult Details(int? id)
        {
            if (id == null)
            {
                return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
            }

            TeamBoards teamBoards = new TeamBoards();
            teamBoards.Boards = (from b in db.Boards
                                 where b.TeamId == id
                                 select b).ToList();
            teamBoards.Team = (from t in db.Teams
                               where t.TeamId == id
                               select t).FirstOrDefault();

            if (teamBoards == null)
            {
                return HttpNotFound();
            }
            return View(teamBoards);
        }

Dann spezifiziere ich es meiner Ansicht nach nicht als Liste. Ich mache einfach "@model TaskBoard.Models.ViewModels.TeamBoards". Dann brauche ich nur eine für jede, wenn ich über die Boards des Teams iteriere. Hier ist meine Ansicht:

@model TaskBoard.Models.ViewModels.TeamBoards

@{
    ViewBag.Title = "Details";
}

<h2>Details</h2>

<div>
    <h4>Team</h4>
    <hr />


    @Html.ActionLink("Create New Board", "Create", "Board", new { TeamId = @Model.Team.TeamId}, null)
    <dl class="dl-horizontal">
        <dt>
            @Html.DisplayNameFor(model => Model.Team.Name)
        </dt>

        <dd>
            @Html.DisplayFor(model => Model.Team.Name)
            <ul>
                @foreach(var board in Model.Boards)
                { 
                    <li>@Html.DisplayFor(model => board.BoardName)</li>
                }
            </ul>
        </dd>

    </dl>
</div>
<p>
    @Html.ActionLink("Edit", "Edit", new { id = Model.Team.TeamId }) |
    @Html.ActionLink("Back to List", "Index")
</p>

Ich bin ziemlich neu in ASP.NET MVC, daher habe ich eine Weile gebraucht, um dies herauszufinden. Ich hoffe, dieser Beitrag hilft jemandem, es in kürzerer Zeit für sein Projekt herauszufinden. :-)

Sie können das zweite Objekt jederzeit in einem ViewBag oder View Data übergeben.

1. Erstellen Sie eine neue Klasse in Ihrem Modell und den Eigenschaften von LoginViewModelund RegisterViewModel:

   public class UserDefinedModel() 
   {
       property a1 as LoginViewModel 
       property a2 as RegisterViewModel 
   }

2. Dann verwenden Sie UserDefinedModelin Ihrer Ansicht.

Dies ist ein vereinfachtes Beispiel mit IEnumerable.

Ich habe zwei Modelle in der Ansicht verwendet: ein Formular mit Suchkriterien (SearchParams-Modell) und ein Raster für Ergebnisse, und ich hatte Probleme damit, das IEnumerable-Modell und das andere Modell in derselben Ansicht hinzuzufügen. Folgendes habe ich mir ausgedacht, hoffe, das hilft jemandem:

@using DelegatePortal.ViewModels;

@model SearchViewModel

@using (Html.BeginForm("Search", "Delegate", FormMethod.Post))
{

                Employee First Name
                @Html.EditorFor(model => model.SearchParams.FirstName,
new { htmlAttributes = new { @class = "form-control form-control-sm " } })

                <input type="submit" id="getResults" value="SEARCH" class="btn btn-primary btn-lg btn-block" />

}
<br />
    @(Html
        .Grid(Model.Delegates)
        .Build(columns =>
        {
            columns.Add(model => model.Id).Titled("Id").Css("collapse");
            columns.Add(model => model.LastName).Titled("Last Name");
            columns.Add(model => model.FirstName).Titled("First Name");
        })

...)

SearchViewModel.cs:

namespace DelegatePortal.ViewModels
{
    public class SearchViewModel
    {
        public IEnumerable<DelegatePortal.Models.DelegateView> Delegates { get; set; }

        public SearchParamsViewModel SearchParams { get; set; }
....

DelegateController.cs:

// GET: /Delegate/Search
    public ActionResult Search(String firstName)
    {
        SearchViewModel model = new SearchViewModel();
        model.Delegates = db.Set<DelegateView>();
        return View(model);
    }

    // POST: /Delegate/Search
    [HttpPost]
    public ActionResult Search(SearchParamsViewModel searchParams)
    {
        String firstName = searchParams.FirstName;
        SearchViewModel model = new SearchViewModel();

        if (firstName != null)
            model.Delegates = db.Set<DelegateView>().Where(x => x.FirstName == firstName);

        return View(model);
    }

SearchParamsViewModel.cs:

namespace DelegatePortal.ViewModels
{
    public class SearchParamsViewModel
    {
        public string FirstName { get; set; }
    }
}