When should a page use a layout in MVC? - asp.net-mvc

When should a page use layout or render layout? I'm a little confused when I should create a page which the page using layout.
different between
#{
Layout = null;
}
And
#{
ViewBag.Title = "Edit";
Layout = "~/Views/Shared/_Layout.cshtml";
}

_Layout is like a masterpage in ASP.NET webforms. If you want to apply a common theme (menu, styles ..) across many pages then _Layout file is the best place to put into.
You can have one single _Layout file for the entire application or one each for each specific module of the application.
_ViewStart file has the reference to the _Layout page used in the application.
If you use the below code then the respective page resets the layout to null and does not render the layout defined in _ViewStart. Code in _ViewStart file gets executed at the start of each View.
#{
Layout = null;
}
If you want any specific layout in a page overriding the default layout defined int _ViewStart then you can do as below
#{
ViewBag.Title = "Edit";
Layout = "~/Views/Shared/_OtherLayout.cshtml";
}
You don't need to explicitly set the Layout in any of the individual view files unless if you want to override the default layout defined in _ViewStart.
Or if you want the _ViewStart to decide which layout page to render based on the controller then you can write something like below in _ViewStart page. The view will have the respective layout themes applied when rendered.
#{
var controller = HttpContext.Current.Request.RequestContext.RouteData.Values["Controller"].ToString();
string layout = "";
if (controller == "ReportController")
{
layout = "~/Views/Shared/_ReportsLayout.cshtml";
}
else
{
layout = "~/Views/Shared/_Layout.cshtml";
}
Layout = layout;
}

Ade,
I answered a similar question a while back:
*From scottgu's blog (ref: http://weblogs.asp.net/scottgu/archive/2010/10/22/asp-net-mvc-3-layouts.aspx):
Starting with the ASP.NET MVC 3 Beta release, you can now add a file called _ViewStart.cshtml (or _ViewStart.vbhtml for VB) underneath the \Views folder of your project:
The _ViewStart file can be used to define common view code that you want to execute at the start of each View’s rendering. For example, we could write code within our _ViewStart.cshtml file to programmatically set the Layout property for each View to be the SiteLayout.cshtml file by default:
Because this code executes at the start of each View, we no longer need to explicitly set the Layout in any of our individual view files (except if we wanted to override the default value above).
Important: Because the _ViewStart.cshtml allows us to write code, we can optionally make our Layout selection logic richer than just a basic property set. For example: we could vary the Layout template that we use depending on what type of device is accessing the site – and have a phone or tablet optimized layout for those devices, and a desktop optimized layout for PCs/Laptops. Or if we were building a CMS system or common shared app that is used across multiple customers we could select different layouts to use depending on the customer (or their role) when accessing the site.
This enables a lot of UI flexibility. It also allows you to more easily write view logic once, and avoid repeating it in multiple places.*
see Where and how is the _ViewStart.cshtml layout file linked? for details

The _Layout is a template/framework/masterpage for all your views. It saves you from adding things like menus, sidebars, the html head or javascript/css includes on each and every new view you create. Use a layout page to take have "wrapping" html that is rendered around your views.

Related

What is layout indicates in view page of nopcommerce 3.90?

I want to know that what is layout in view page of nopcommerce which given the path of other view page. But if I remove that layout then also there is no change in nopcommerce.
Like in index.cshtml there is Layout = "~/Views/Shared/_ColumnsOne.cshtml";.
Now, my question is why this other cshtml path has given, and if I remove this line then why is there no change in nopcommerce?
The Layout property allows you to configure a "parent" view, the system renders the views from parent, in your case _Root.Head.cshtml -> _Root.cshtml -> _ColumnsOne.cshtml -> Index.cshtml, inside every layout cshtml you can find a #RenderBody() call where the child view is rendered.
When you remove the layout line inside Index.cshtml the system looks for the a default value and that value is configured inside the _ViewStart.cshtml, and this layout has configured the _ColumnsOne.cshtml, thats the reason that you cant see any changes.
The content of the _ViewStart.cshtml
#{
Layout = "~/Views/Shared/_ColumnsOne.cshtml";
}
Into nopcommerce layout means a master page.
That can be used into all pages as master layout.
If you remove that line than nopcommerce affect design layout.
If your design is not change than this page called as partial page, means call with in any other view page.

Force all Areas to use same Layout

I have the following project structure:
/Views/Shared/_Layout;
/Areas/Area1/Views/ControllerName/Index;
...
/Areas/AreaN/Views/ControllerName/Index.
Is there any way to force all areas to use the _Layout as a base layout?
Is there any way to do it without adding the _ViewStart file (for example, via the routing configuration)?
See Also:
How do I specify different Layouts in the ASP.NET MVC 3 razor ViewStart file?
You just have to add a file named:
_ViewStart.cshtml
Under each area views folder:
/Areas/Area1/Views/_ViewStart.cshtml
And edit the file to point to the root layout like this:
#{
Layout = "~/Views/Shared/_Layout.cshtml";
}
In order for this to work, you do not have to specify a value in the view's layout property, if you do, you would be overriding the global layout
Note: As Tony mentioned, you could edit each view's layout property to point to the root layout, however this is not the recommended way to do it since you would be coupling your views with your layout and change it would be painful
Edit 1
If you would like to use code to set the default view's layout, perhaps you should consider writing a custom view engine.
Try to google about custom RazorViewEngine and RazorView
This article could be a good start point
http://weblogs.asp.net/imranbaloch/archive/2011/06/27/view-engine-with-dynamic-view-location.aspx
I have not done something like this but I hope I'm pointing you in the right direction
Expanding on the answer by Jupaol....
At least in VS2013, the _ViewStart.cshtml file is added by default when creating the area, so it's already there, and you can change the contents as he notes to point to the root _Layout.cshtml. You can then remove the _Layout.cshtml in the area, since it is no longer used (and a potential source of confusion now)
However, by so doing any routing performed in that root _Layout.cshtml will need to consider areas.
The default _Layout.cshtml has a number of ActionLink helpers that need a slight modification:
Add the RouteValueDictionary param to any ActionLink calls by setting Area="". Note that empty string refers to the root level. This will allow these links to work correctly when invoked from within an area, still work when invoked from the root.
e.g.:
<li>#Html.ActionLink("Home", "Index", "Home", new { Area = "" }, null)</li>
You specify a layout using:
#{
Layout = "_Layout";
}
If you want to make this easier to change all at once. Perhaps you could just set it as a view bag variable and pass it in on the controller. To make it even easier you could create a base controller that the other controllers inherit from and have it assign the layout to the view bag there.
Not sure why routing would need to change or perhaps I am not understanding. Hope this helps :)

The following sections have been defined but have not been rendered for the layout page "~/Views/Shared/_Layout.cshtml"

I know there are a few questions that have been answered but I didn't find something specific to my case.
I'm using the mobile capabilities of MVC4. So I created a _layout.mobile.cshtml and the corresponding views.
The error above happens when I go in with a mobile device. As you can see, it is trying to display the regular _layout.cshtml instead of the _layout.mobile.cshtml. So I'm assuming it is also trying to display the view (say Index.mobile.cshtm) which doesn't have the section in question. Basically it is mixing the regular layout with the mobile views.
This doesn't happen all the time. If I recycle the pool it works again for a while and then all of the sudden it goes back to having the error and it will continue until I recycle the pool again.
Has anyone seen this problem before that can shed some light?
Thanks
John
In the _ViewStart.cshtml available under the Views folder, change the Layout value to your custom layout. I think this may help.. (Make sure that you are returning View instead of partial view)
for example
#{
Layout = "~/Views/Shared/_layout.mobile.cshtml";
}
In case if you want to change the layout for a specific page you can explicitly define it at the top of the page as a page directive.
in the index.cshtml there is a section being called defined in the original layout file "_LayoutHome.cshtml" that is not defined in the new bootstrap layout.
specifically: #RenderSection("featured", required: false)
So the solution is to either add this section to the new layout (look for it in the original layout and paste it) or simply delete it from the index.cshtml.
I had also face the same problem I removed
#section featured {
From View
Another way to do this is to use a conditional block in your _ViewStart.cshtml page. For example, you may have two layouts depending on the device regular user. Using pseudo-code for the reading of the device/browser type bit, it would look something like this:
#{
if(userIsMobile)
{
Layout = "~/Views/Shared/_MobileLayout.cshtml";
}
else
{
Layout = "~/Views/Shared/_Layout.cshtml";
}
}
I have used this to display or hide sections or menu items as needed for different classes of user; it should work as well for device-specific layouts.
Joey Morgan

How does a view know which layout to use? Where is the default?

In default mvc app. There are Layout and content pages, You know (_Layout, Home, Contact, etc.)
And content pages do not contain layout refrence as this:
Layout = "~/Views/Shared/_Layout.cshtml";
In content pages this code is missing.
But they works. How does it do this without layout refrence?
Because your _ViewStart.cshtml contains a reference to the default layout that will be used when a specific one is not stated on the view.
When you want to change the layout for a single view, you would include a Layout = "..."; to that view.
If you want folder specific layouts i.e. (Home, Account, Product etc), you can put _ViewStart.cshtml in that folder & point out whichever layout tobe used in that file & it will override the root level layout.
Find ScottGu's blogs for more details on layouts & sections here & here

How to link layout pages to views MVC 3

I have a layout page (or master page) with MVC 3 and would like to make my views sort of content pages to this layout page, but alas I have no clue how to do this
I am totally new to MVC 3 and this may sound as a stupid question but I can't find anything relating to this.
In your view code, you would simply set the layout file. Assuming your Layout is named _Layout.cshtml and stored in /Views/Shared, the code might be:
#{
Layout = "~/Views/Shared/_Layout.cshtml";
}
in MVC 3 we can set the layout page for the current view by doing this one
#{
ViewBag.Title = "Home page";
Layout = "../Shared/_Layout.cshtml";
}
if application need the same layout everywhere in application you can set them for whole application by making a _ViewStart.cshtml in views folder and place this one.
#{
Layout = "~/Views/Shared/_LayoutPage.cshtml";
}
first code can be apply in the views for setting the layout for page only you have. or second can be apply in _ViewStart.cshtml in Views directories of your application.
Also, when you create new view you can select a "master page" for it. By default it's whatever "_ViewStart.cshtml" is linking to.

Resources