Passing a model through a Partial View MVC3

Question

I have a Partial View that goes like this:

@model IEnumerable<NutricionApp.Models.Ingrediente>

<table>
<tr>
    <th>
        NombreIngrediente
    </th>
    <th>
        CantidadPorPorcion
    </th>
    <th>
        UnidadPorPorcion
    </th>
    <th></th>
</tr>

@foreach (var item in Model) {
<tr>
    <td>
        @Html.DisplayFor(modelItem => item.NombreIngrediente)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.CantidadPorPorcion)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.UnidadPorPorcion)
    </td>

</tr>
}

</table>

I want to render said partial view in this View, that is strongly typed:

@model NutricionApp.Models.Platillo

@{
    ViewBag.Title = "Create";
    Model.ListadeIngredientes = new List<NutricionApp.Models.ListaIngredientes>();
}

<h2>Create</h2>

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Platillo</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.NombrePlatillo)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.NombrePlatillo)
            @Html.ValidationMessageFor(model => model.NombrePlatillo)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.idRestaurante)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.idRestaurante)
            @Html.ValidationMessageFor(model => model.idRestaurante)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.DescripcionPlatillo)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.DescripcionPlatillo)
            @Html.ValidationMessageFor(model => model.DescripcionPlatillo)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.esAprobado)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.esAprobado)
            @Html.ValidationMessageFor(model => model.esAprobado)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.esDisponible)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.esDisponible)
            @Html.ValidationMessageFor(model => model.esDisponible)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.precio)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.precio)
            @Html.ValidationMessageFor(model => model.precio)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.VigenciaPlatillo)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.VigenciaPlatillo)
            @Html.ValidationMessageFor(model => model.VigenciaPlatillo)
        </div>
        <!--<table>
        <tr><th>Nombre</th></tr>
        @@foreach (var item in (List<NutricionApp.Models.ListaIngredientes>)Session["Lista"])
                {
            <tr>
            <p>
                <td>@@item.ingrediente.NombreIngrediente</td>
            </p>
            </tr>
        }
        </table>-->
        @Html.Partial("_Ingredientes", Model.);
        <br />
        @Html.Partial("_ListaIngredientes", Model.ListadeIngredientes)

        <p>
            <input type="submit" value="Create" />
        </p>

    </fieldset>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

And in my controller I have this:

//....
 public ActionResult _ListaIngredientes()
    {
        IEnumerable<ListaIngredientes> ListaDemo = new List<ListaIngredientes>();
        return View(ListaDemo);
    }

    public ActionResult _Ingredientes()
    {
        return View(db.Ingredientes.ToList());
    } 

In this case, db.Ingredients.ToList()); returns the data i need to show on the partial view. Problem is, when I try to display said list in my view, it tells me I have to pass a IEnumerable model corresponding to my view...

If I access the PartialView from an URL, it shows me the data correctly. However if i try to do this from inside a View, it passes the Model it's currently using due to being strongly-typed. How can I pass the model i need (the list of my ingredients table, db.Ingredientes.ToList());

Answer 1

You can reference the parent view's model from the partial view so perhaps package it all together in the top level view. You can also pass the model down explicitly (or whatever you want) via the Html.Partial overload. If you decide to access the model from the View make sure you include the @model directive in both View and PartialView.

Answer 2

Your view is expecting a IEnumerable of a model (NutricionApp.Models.Ingrediente). You are passing it an IEnumerable of an entity (ListaIngredientes). That's why it's barfing.

Assuming that the constructor of your Ingrediente model accepts a ListaIngredientes as a parameter, you can change this line:

@Html.Partial("_ListaIngredientes", Model.ListadeIngredientes)

to

@Html.Partial("_ListaIngredientes", Model.ListadeIngredientes.Select(i => new Ingrediente(i)))

which should fix your problem.

Answer 3

Are you trying to render dynamic partial view based on data passed to parent view? if yes, use Html.RenderAction() method and do some modification on your controller so that it returns a different data every time it's called and returns the partial view to parent view. Assuming that there the Platillo and ingredient entities are related with one to many relation, you could try something like this:

In parent view:

@{ Html.RenderAction("_Ingredientes", "YourControllerName", new {platilloId=Model.PlatilloId}); }

Change your controller method:

public ActionResult _Ingredientes(int platilloId )
    {
return PartialView( "_IngredientView", db.Platillos.where(p=>p.PlatilloId==platilloId ).Ingredients.ToList();

    } 

Good luck

Answer 4

How I solved it: I just created a new Method, that encompassed both the Method i was originally using, and the method i wanted to use for my PartialView The rest was just using Lists to keep track of my data =D