ASP.NET MVC 5 layout trouble with partial View
Question
I am a newbie to a MVC world from web form world ( 3 days old :) ) . I created a MVC website which contains a dynamically loaded menu from the DB and load the associated page based on what is clicked.. So far I load menu view on the separate page whose Index action return a View(list of menu items) and the click of each submenu items calls the associated page.. I created a new layout page which loads the menu items ( copying the code from menuView)
Here's the _Menu
@model IEnumerable<MedicareQA_MVC.Models.spS_MenuItems_Result>
<div >
<ul class="nav nav-tabs nav-stacked col-sm-3 " >
@{
var mainElmnt = Model.Select(o=>o.MenuElementName).Distinct();
foreach (var mainNode in mainElmnt)
{
var elmnts = Model.Where(p => p.MenuElementName == mainNode);
<li >@mainNode</li>
if( elmnts.Count() >0)
{
foreach (var elmt in elmnts)
{
<ul class="nav nav-tabs nav-stacked ">
<li>@Html.ActionLink(elmt.Element,"QADetails","Home",new {id =elmt.RecID },null) </li>
</ul>
}
}
}
}
</ul>
</div>
The page loads correctly but on the click of the menu items i get the following
The model item passed into the dictionary is of type 'System.Collections.Generic.List
The menu controller
public ActionResult Index()
{
MenuModel menu = new MenuModel();
return View(menu.GetMenu1());
}
the _Layout
@model IEnumerable<MedicareQA_MVC.Models.spS_MenuItems_Result>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title - My ASP.NET MVC Application</title>
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<meta name="viewport" content="width=device-width" />
@Styles.Render("~/Content/Bootstrap")
@Scripts.Render("~/bundles/modernizr")
<link href="~/Content/bootstrap.css" rel="stylesheet" />
</head>
<body>
<table>
<tr class="navbar navbar-fixed-top">
<td class="span12" colspan="2"> <h1>Welcome to our Website</h1></td>
</tr>
<tr >
<td class="span4 nav nav-stacked " style="vertical-align:top" >
@Html.Partial("_Menus",Model)
</td>
<td class="span7">
@RenderSection("featured", required: false)
@RenderBody()
</td>
</tr>
</table
The page loads fine with the menus. But on event of clicking the menu I get this run time error
The model item passed into the dictionary is of type 'System.Collections.Generic.List
1[MedicareQA_MVC.Models.QuestionAnswer]', but this dictionary requires a model item of type 'System.Collections.Generic.IEnumerable
3 answers
solution1
0 2015-03-31 13:25:12
return View(menu.GetMenu1());
is returning a list of items whereas in view you have used IEnumerable, ie enumerable as model.
Change top line of view to
@model List<MedicareQA_MVC.Models.spS_MenuItems_Result>
solution2
0 2015-03-31 15:05:27
The view accepts Ienumerable and this should work the same way for List. Moreover i did find a temporary working solution as per dotnetcurry and I did the following. Create a div container in the _layout and call ajax functionality
<script type="text/javascript">
if ($("#menuContainer")[0].innerHTML == "") {
$.ajax({
url: "@Url.Content("~/Menu/MenuLoader")",
type: "GET",
cache:true,
success: function (response) {
var container = $("#menuContainer");
container.html(response);
},
error: function () {
alert("nothing");
}
});
}
</script>
THe menu Controller has the following
[AcceptVerbs(HttpVerbs.Get)] public ActionResult MenuLoader() { MenuModel menu = new MenuModel();
return PartialView("_Menus", menu.GetMenu1()); }
Unfortunately the menu loads after the page loads . Wish there was <asp:scripthandler> kind of a funcitionality I could use somewhere around here....
Folks thanks for the support
solution3
0 2015-04-02 02:23:51
Yep that was an awful solution...I finally figured it out. since I dont have the code with me, I can only explain. So the issue I had was that I declared the Model at the _MainLayout page. So the menu loaded correctly the first time because the controller had the corresponding Action control. But when I clicked on a menu item it loads another page and another controller which of course did not have the correct model, hence the runtime errors. The work around. I removed the Model from the _MainLayout and I called @html.Action("ActionNameToLoadMenu") in the _MainLayout. The corresponding ActionMethod will return a partial View of the dynamic menu. I repeated the ActionMethod in other controller for the page that was being referenced and it worked. Thanks for all your help
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.