Pass data to layout that are common to all pages

Question

I have a website which have a layout page  However this layout page have data which all pages model must provide such page title  page name and the location where we actually are for an HTML helper I did which perform some action  Also each page have their own view models properties   How can I do this  It seems that its a bad idea to type a layout but how do I pass theses infos

User · Answer

I do not think any of these answers are flexible enough for a large enterprise level application. I'm not a fan of overusing the ViewBag, but in this case, for flexibility, I'd make an exception. Here's what I'd do...

You should have a base controller on all of your controllers. Add your Layout data OnActionExecuting in your base controller (or OnActionExecuted if you want to defer that)...

public class BaseController : Controller
{
    protected override void OnActionExecuting(ActionExecutingContext     
        filterContext)
    {
        ViewBag.LayoutViewModel = MyLayoutViewModel;
    }
}

public class HomeController : BaseController
{
    public ActionResult Index()
    {
        return View(homeModel);
    }
}

Then in your _Layout.cshtml pull your ViewModel from the ViewBag...

@{
  LayoutViewModel model = (LayoutViewModel)ViewBag.LayoutViewModel;
}

<h1>@model.Title</h1>

Or...

<h1>@ViewBag.LayoutViewModel.Title</h1>

Doing this doesn't interfere with the coding for your page's controllers or view models.

User · Answer

You can also make use of RenderSection   it  helps to you to inject your Model data into the  Layout view   You can inject View Model Data  Json  Script   CSS  HTML etc  In this example I am injecting Json from my Index View to Layout View   Index chtml   section commonLayoutData        lt script gt           var products    Html Raw Json Encode Model ToList            lt  script gt            Layout cshtml   RenderSection  commonLayoutData   false    This eliminates the need of creating a separate Base View Model   Hope helps someone

User · Answer

Presumably  the primary use case for this is to get a base model to the view for all  or the majority of  controller actions   Given that  I ve used a combination of several of these answers  primary piggy backing on Colin Bacon s answer   It is correct that this is still controller logic because we are populating a viewmodel to return to a view   Thus the correct place to put this is in the controller   We want this to happen on all controllers because we use this for the layout page   I am using it for partial views that are rendered in the layout page   We also still want the added benefit of a strongly typed ViewModel  Thus  I have created a BaseViewModel and BaseController   All ViewModels Controllers will inherit from BaseViewModel and BaseController respectively   The code   BaseController  public class BaseController   Controller       protected override void OnActionExecuted ActionExecutedContext filterContext                base OnActionExecuted filterContext            var model   filterContext Controller ViewData Model as BaseViewModel           model AwesomeModelProperty    Awesome Property Value           model FooterModel   this getFooterModel               protected FooterModel getFooterModel                 FooterModel model   new FooterModel            model FooterModelProperty    OMG Becky    Another Awesome Property              Note the use of OnActionExecuted as taken from this SO post  HomeController  public class HomeController   BaseController       public ActionResult Index string id                HomeIndexModel model   new HomeIndexModel                populate HomeIndexModel              return View model             BaseViewModel  public class BaseViewModel       public string AwesomeModelProperty   get  set        public FooterModel FooterModel   get  set        HomeViewModel  public class HomeIndexModel   BaseViewModel        public string FirstName   get  set            other awesome properties     FooterModel  public class FooterModel       public string FooterModelProperty   get  set        Layout cshtml   model WebSite Models BaseViewModel  lt  DOCTYPE html gt   lt html gt   lt head gt       lt      meta tags and styles and whatnot      gt   lt  head gt   lt body gt       lt header gt             Html RenderPartial   Nav   Model FooterModel FooterModelProperty         lt  header gt        lt main gt           lt div class  container  gt               RenderBody            lt  div gt              Html RenderPartial   AnotherPartial   Model                Html RenderPartial   Contact           lt  main gt        lt footer gt             Html RenderPartial   Footer   Model FooterModel          lt  footer gt        lt      render scripts      gt        RenderSection  scripts   required  false   lt  body gt   lt  html gt     Nav cshtml   model string  lt nav gt       lt ul gt           lt li gt               lt a href   Model  target   blank  gt Mind Blown  lt  a gt           lt  li gt       lt  ul gt   lt  nav gt    Hopefully this helps

User · Answer

Why hasn t anyone suggested extension methods on ViewData   Option  1  Seems to me by far the least intrusive and simplest solution to the problem  No hardcoded strings  No imposed restrictions  No magic coding  No complex code   public static class ViewDataExtensions       private const string TitleData    Title       public static void SetTitle lt T gt  this ViewDataDictionary lt T gt  viewData  string value    gt  viewData TitleData    value      public static string GetTitle lt T gt  this ViewDataDictionary lt T gt  viewData    gt   string viewData TitleData             Set data in the page  ViewData SetTitle  abc      Option  2  Another option  making the field declaration easier   public static class ViewDataExtensions       public static ViewDataField lt string  V gt  Title lt V gt  this ViewDataDictionary lt V gt  viewData    gt  new ViewDataField lt string  V gt  viewData   Title           public class ViewDataField lt T V gt        private readonly ViewDataDictionary lt V gt   viewData      private readonly string  field      private readonly T  defaultValue       public ViewDataField ViewDataDictionary lt V gt  viewData  string field  T defaultValue                 viewData   viewData           field   field           defaultValue   defaultValue             public T Value           get   gt   T   viewData  field      defaultValue           set   gt   viewData  field    value            Set data in the page  Declaration is easier than first option  but usage syntax is slightly longer   ViewData Title   Value    abc     Option  3  Then can combine that with returning a single object containing all layout-related fields with their default values   public static class ViewDataExtensions       private const string LayoutField    Layout       public static LayoutData Layout lt T gt  this ViewDataDictionary lt T gt  viewData    gt            LayoutData  viewData LayoutField      viewData LayoutField    new LayoutData         public class LayoutData       public string Title   get  set              Set data in the page  var layout   ViewData Layout    layout Title    abc     This third option has several benefits and I think is the best option in most cases    Simplest declaration of fields and default values  Simplest usage syntax when setting multiple fields  Allows setting various kinds of data in the ViewData  eg  Layout  Header  Navigation   Allows additional code and logic within LayoutData class    P S  Don t forget to add the namespace of ViewDataExtensions in  ViewImports cshtml

User · Answer

if you want to pass an entire model go like so in the layout    model ViewAsModelBase  lt  DOCTYPE html gt   lt html gt   lt head gt       lt meta http-equiv  X-UA-Compatible  content  IE edge  gt       lt meta charset  utf-8   gt       lt link href   img phytech icon ico  rel  shortcut icon  type  image x-icon    gt       lt title gt  ViewBag Title lt  title gt       RenderSection  styles   required  false           lt script type  text javascript  src  http   code jquery com jquery-1 8 3 min js  gt  lt  script gt       RenderSection  scripts   required  false       RenderSection  head   required  false   lt  head gt   lt body gt       Html Action   Header   Controller   new  model   Model        lt section id  content  gt           RenderBody        lt  section gt             RenderSection  footer   required  false   lt  body gt   lt  html gt    and add this in the controller   public ActionResult  Header ViewAsModelBase model

User · Answer

If you are required to pass the same properties to each page  then creating a base viewmodel that is used by all your view models would be wise  Your layout page can then take this base model   If there is logic required behind this data  then this should be put into a base controller that is used by all your controllers   There are a lot of things you could do  the important approach being not to repeat the same code in multiple places   Edit  Update from comments below  Here is a simple example to demonstrate the concept   Create a base view model that all view models will inherit from   public abstract class ViewModelBase       public string Name   get  set       public class HomeViewModel   ViewModelBase       Your layout page can take this as it s model    model ViewModelBase  lt  DOCTYPE html gt   lt html gt       lt head gt           lt meta name  viewport  content  width device-width    gt           lt title gt Test lt  title gt       lt  head gt       lt body gt           lt header gt              Hello  Model Name          lt  header gt           lt div gt               this RenderBody            lt  div gt       lt  body gt   lt  html gt    Finally set the data in the action method   public class HomeController       public ActionResult Index                 return this View new HomeViewModel   Name    Bacon

User · Answer

what i did is very simple and it s works Declare Static property in any controller or you can make a data-class with static values if you want like this  public static username    quot Admin quot   public static UserType    quot Administrator quot    These values can be updated by the controllers based on operations  later you can use them in your  Layout In  layout cshtml  project name Controllers HomeController username  project name Controllers HomeController UserType

User · Answer

instead of going through this you can always use another approach which is also fast  create a new partial view in the Shared Directory and call your partial view in your layout as   Html Partial  MyPartialView     in your partial view you can call your db and perform what ever you want to do         IEnumerable lt HOXAT Models CourseCategory gt  categories   new HOXAT Models HOXATEntities   CourseCategories      lt div gt    do what ever here  lt  div gt    assuming you have added your Entity Framework Database

User · Answer

Another option is to create a separate LayoutModel class with all the properties you will need in the layout  and then stuff an instance of this class into ViewBag  I use Controller OnActionExecuting method to populate it   Then  at the start of layout you can pull this object back from ViewBag and continue to access this strongly typed object

User · Answer

There s another way to handle this  Maybe not the cleanest way from an architectural point of view  but it avoids a lot of pain involved with the other answers  Simply inject a service in the Razor layout and then call a method that gets the necessary data    inject IService myService   Then later in the layout view    if  await myService GetBoolValue            Good to go        Again  not clean in terms of architecture  obviously the service shouldn t be injected directly in the view   but it gets the job done

User · Answer

You could create a razor file in the App Code folder and then access it from your view pages   Project Repository IdentityRepository cs  namespace Infrastructure Repository       public class IdentityRepository   IIdentityRepository               private readonly ISystemSettings  systemSettings          private readonly ISessionDataManager  sessionDataManager           public IdentityRepository              ISystemSettings systemSettings                                      systemSettings   systemSettings                     public string GetCurrentUserName                         return HttpContext Current User Identity Name                      Project App Code IdentityRepositoryViewFunctions cshtml    using System Web Mvc  using Infrastructure Repository  functions       public static IIdentityRepository IdentityRepositoryInstance               get   return DependencyResolver Current GetService lt IIdentityRepository gt                  public static string GetCurrentUserName               get                       var identityRepo   IdentityRepositoryInstance              if  identityRepo    null                                return identityRepo GetCurrentUserName                              return null                      Project Views Shared  Layout cshtml  or any other  cshtml file    lt div gt       IdentityRepositoryViewFunctions GetCurrentUserName  lt  div gt

User · Answer

I used RenderAction html helper for razor in layout          Html RenderAction  Action    Controller         I needed it for simple string  So my action returns string and writes it down easy in view   But if you need complex data you can return PartialViewResult and model    public PartialViewResult Action                 var model   someList          return PartialView    Views Shared  maPartialView cshtml   model           You just need to put your model begining of the partial view   maPartialView cshtml  that you created   model List lt WhatEverYourObjeIs gt    Then you can use data in the model in that partial view with html

User · Answer

You don t have to mess with actions or change the model  just use a base controller and cast the existing controller from the layout viewcontext   Create a base controller with the desired common data  title page location etc  and action initialization      public abstract class  BaseController Controller       public Int32 MyCommonValue   get  private set         protected override void OnActionExecuting ActionExecutingContext filterContext             MyCommonValue   12345           base OnActionExecuting filterContext             Make sure every controller uses the base controller     public class UserController  BaseController        Cast the existing base controller from the view context in your  Layout cshml page            var myController     BaseController ViewContext Controller      Now you can refer to values in your base controller from your layout page    myController MyCommonValue   UPDATE  You could also create a page extension that would allow you to use this     Allows typed  this Controller     in cshtml files public static class MyPageExtensions       public static  BaseController Controller this WebViewPage page    gt  Controller lt  BaseController gt  page       public static T Controller lt T gt  this WebViewPage page  where T    BaseController   gt   T page ViewContext Controller      Then you only have to remember to use this Controller   when you want the controller          var myController   this Controller       BaseController     or specific controller that inherits from  BaseController            var myController   this Controller lt MyControllerType gt

User · Answer

Other answers have covered pretty much everything about how we can pass model to our layout page  But I have found a way using which you can pass variables to your layout page dynamically without using any model or partial view in your layout  Let us say you have this model -   public class SubLocationsViewModel       public string city   get  set        public string state   get  set        And you want to get city and state dynamically  For e g   in your index cshtml you can put these two variables in ViewBag   model  MyProject Models ViewModel SubLocationsViewModel        ViewBag City   Model city      ViewBag State   Model state      And then in your layout cshtml you can access those viewbag variables   lt div class  text-wrap  gt       lt div class  heading  gt  ViewBag City  ViewBag State lt  div gt   lt  div gt

User · Answer

You can use like this            ApplicationDbContext db   new ApplicationDbContext        IEnumerable lt YourModel gt  bd recent   db YourModel Where m   gt  m Pin    true  OrderByDescending m  gt m ID  Select m   gt  m      lt div class  col-md-12  gt       lt div class  panel panel-default  gt           lt div class  panel-body  gt               lt div class  baner1  gt                   lt h3 class  bb-hred  gt Recent Posts lt  h3 gt                   foreach var item in bd recent                                         lt a href   BaiDangs BaiDangChiTiet  item ID  gt  item Name lt  a gt                                 lt  div gt           lt  div gt       lt  div gt   lt  div gt

User · Answer

It s incredible that nobody has said this over here  Passing a viewmodel through a base controller is a mess  We are using user claims to pass info to the layout page  for showing user data on the navbar for example   There is one more advantage  The data is stored via cookies  so there is no need to retrieve the data in each request via partials  Just do some googling  asp net identity claims

User · Answer

Creating a base view which represents the Layout view model is a terrible approach  Imagine that you want to have a model which represents the navigation defined in the layout  Would you do CustomersViewModel   LayoutNavigationViewModel  Why  Why should you pass the navigation model data through every single view model that you have in the solution   The Layout view model should be dedicated  on its own and should not force the rest of the view models to depend on it   Instead  you can do this  in your  Layout cshtml file      var model   DependencyResolver Current GetService lt MyNamespace LayoutViewModel gt         Most importantly  we don t need to new LayoutViewModel   and we will get all the dependencies that LayoutViewModel has  resolved for us   e g   public class LayoutViewModel       private readonly DataContext dataContext      private readonly ApplicationUserManager userManager       public LayoutViewModel DataContext dataContext  ApplicationUserManager userManager

[asp.net-mvc-4] Pass data to layout that are common to all pages

Examples related to asp.net-mvc-4