Multiple Model binding in Asp.Net MVC

Question

I have a view to which a Model is bind liked this

@model IEnumerable<InstaFood.Core.Kitchen>

This is how I am trying to add the partial view

@Html.Partial("~/Views/Home/helperTemplates/_menu.cshtml")

In my controller I have this

    public ActionResult ViewKitchens()
    {
        IEnumerable<Kitchen> k = Kitchen.GetAll();
        return View(k);
    }

In my main view I have a partial view which is bind to a different model like this

@model InstaFood.Core.User



<div class="row">
<div class="large-12 columns">
    <nav class="top-bar" data-topbar role="navigation">
        <ul class="title-area">
            <li class="name">
                <h1 class="show-for-small-only"><a href>Menu</a></h1>
            </li>
            <li class="toggle-topbar menu-icon"><a href="#"><span></span></a>
            </li>
        </ul>
        <section class="top-bar-section">
            <ul class="left">
                <li class="divider"></li>
                <li>@Html.ActionLink("Home", "Dashboard", "Home")</li>
                <li class="divider"></li>
                <li>@Html.ActionLink("View Kitchens", "ViewKitchens", "Home")</li>
                <li class="divider"></li>
                <li>@Html.ActionLink("View Institutes", "ViewInstitutes", "Home")</li>
            </ul>

            <ul class="right">
                <li class="has-dropdown">
                    <a href="#">@Model.EmailAddress</a>
                    <ul class="dropdown">
                        <li>@Html.ActionLink("Logout", "Logout", "Account")</li>
                    </ul>
                </li>
            </ul>

        </section>
    </nav>
</div>

Now when I run my code I get this exception,

The model item passed into the dictionary is of type 'Microsoft.WindowsAzure.Storage.Core.Util.CommonUtility+<LazyEnumerable>d__0`1[InstaFood.Core.Kitchen]', but this dictionary requires a model item of type 'InstaFood.Core.User'.

Any solution to this issue? As I am very new to asp.net mvc I am not really sure what is causing this error. My best guess is that it is because of different model binding in a single view.

Answer 1

You have to pass model to your partial and this must be instance of InstaFood.Core.User. There is many way to do that:

@Html.Partial("~/Views/Home/helperTemplates/_menu.cshtml", new ViewDataDictionary { Model = user })

You should create user in controller but you can pass only one viewModel, so you can to create new view model with two properties one is InstaFood.Core.User and another IEnumerable<InstaFood.Core.Kitchen>.:

class ViewModel
{
     public IEnumerable<InstaFood.Core.Kitchen> Kitchens {get; set;}

     public InstaFood.Core.User User {get; set;}
}

and pass it to view.

But in your case is better to use @Html.Action especially when you use this menu in many views or in layout. You should create another action in Controller for getting Menu:

public class Nav : Controller
{
    ...
    public ActionResult Menu()
    {
        var user = new InstaFood.Core.User();//get oure user
        return View("~/Views/Home/helperTemplates/_menu.cshtml", user);
    }

And in view:

...
@Html.Action("Menu", "Nav");

So you have separated Menu logic from Kitchens logic and you don't have to get user in every controller you render menu.

Answer 2

The problem here is that your partial view is trying to load but your controller had not passed it a proper model.

There are several solutions to this particular depending on your app.

You could check if the partial view needs to get loaded during the current action, not showing it if it isn't

You can change your business models to allow both views to receive the same model

You can pass info to the partial view through ViewBag instead of using model binding

Or you can build an instance of your InstaFood.Core.User class within your different model classes and call the partial view with

@Html.Partial("yourPartialView", Model.yourCurrentModelInstafoodCoreUserInstance)