ASP MVC 3 Two Models in One View

Question

I am working on creating a datagrid in ASP MVC 3 where I have two tables in one view. Each table is being used from its own Model. Therefore, I would have to call two Models into one View which does not seem as simple as I wish it was.

I am pretty new to MVC and I was looking through Stack and found this link: Two models in one view in ASP MVC 3

Which seems to be the direction that i would want to go... I think.

Here is the code for my first model:

[Table]
public class Model1
{
    [Column(IsPrimaryKey = true, IsDbGenerated = true)]
    public int Column1 { get; set; }
    [Column]
    public string Column2 { get; set; }
    [Column]
    public string Column3 { get; set; }
}

Here is the code for my second model:

[Table]
public class Model2
{
    [Column(IsPrimaryKey = true, IsDbGenerated = true)]
    public int Column1 { get; set; }
    [Column]
    public int Column2 { get; set; }
    [Column]
    public string Column3  { get; set; }
    [Column]
    public string Column4 { get; set; }
}

Here is the code for the Parent View Model that the other Stack Forum suggested:

public class ParentModelView
{
    public Model1 Model1 { get; set; }
    public Model2 Model2 { get; set; }
}

I was able to get each one to work individually so i know that it isn't any other issue. The other Stack Forum seemed to be a little too vague for my understanding. I feel like there would have to be more to it than just adding another parent model that is using each model within it (what i am getting out of it).

Some other information that you may find useful is that each model is in its own file. Also, Here is my error:

The model item passed into the dictionary is of type 
'System.Data.Linq.Table 1[Model1]', but this dictionary requires a model 
item of type 'System.Collections.Generic.IEnumerable 1[ParentModelView]'.

Description: An unhandled exception occurred during the execution of the
current web request. Please review the stack trace for more information 
about the error and where it originated in the code. 

Exception Details: System.InvalidOperationException: The model item passed 
into the dictionary is of type 'System.Data.Linq.Table 1[Model1]', but this 
dictionary requires a model item of type 
'System.Collections.Generic.IEnumerable 1[ParentModelView]'.

Source Error: 

An unhandled exception was generated during the execution of the current 
web request. Information regarding the origin and location of the exception 
can be identified using the exception stack trace below.

---EDIT 1---

Here is the code inside of my View:

@model IEnumerable<ParentModelView>
@{
    WebGrid gridModel1 = new WebGrid(Model);
    WebGrid gridModel2 = new WebGrid(Model);
}
<div class="Table">
  <h2>Model1</h2>
  @gridModel1.GetHtml(columns: new[] {
      gridModel1.Column("Column1"),
      gridModel1.Column("Column2"),
      gridModel1.Column("Column3")
  })
</div>

<div class="Table" id="rightTable">
  <h2>Model2</h2>
  @*@gridModel2.GetHtml(columns: new[] {
      gridModel2.Column("Column1"),
      gridModel2.Column("Column2"),
      gridModel2.Column("Column3"),
      gridModel1.Column("Column4")
  })*@
</div>

EDIT 2

As most of you have requested, here is my controller code. I know that it is not right because i am not quite sure how to pass through the information between two models into the same view. If someone would be able to help with that, it would be much appreciated.

public class HomeController : Controller
{
    public ActionResult Index()
    {

        Model1Repo repoModel1 = new Model1Repo ();
        var Model1RepoSQL = repoModel1.All();

        Model2Repo repoModel2 = new Model2Repo();
        var Model2RepoSQL = repoModel2.All();

        return View(Model1RepoSQL);
    }
}

Any other information would be much appreciated. Thanks!

Answer 1

I think what you want is something more like this:

public class ParentModelView
{
    public IEnumerable<Model1> Model1 { get; set; }
    public IEnumerable<Model2> Model2 { get; set; }
}

And in your view

@model ParentModelView

@{
    WebGrid gridModel1 = new WebGrid(Model.Model1);
    WebGrid gridModel2 = new WebGrid(Model.Model2);
}

EDIT;

Apparently, you aren't populating the parent model correctly. I assumed you would understand how to do that.

public ActionResult MyAction() {
    var model1 = // get rows of model1
    var model2 = // get rows of model2

    return View("myview", new ParentModelView { Model1 = model1, Model2 = model2 }) ;
}

Answer 2

You can always use ViewModel in this case. For example create a viewmodel

public class ViewModel{

    public int Table1Column1 { get; set; }
    public string Table1Column2 { get; set; }
    public string Table1Column3 { get; set; }


    public int Table2Column1 { get; set; }
    public int Table2Column2 { get; set; }
    public string Table2Column3  { get; set; }
    public string Table2Column4 { get; set; }

}

Get the data into ViewModel from both the models in business layer or data access layer.

P.S: What McGarnagle said is true but it's vice versa, you are sending child models into the view while it is expecting ParentModelView. If you can post parts of code for controller and view, it would be helpful.