Layout

The document discusses layout views in ASP.NET MVC, which allow defining common templates for site-wide elements like headers, footers, and navigation. Layout views can be applied globally via _ViewStart.cshtml and can include sections that child views can populate. RenderBody() displays a view's main content while RenderSection() shows specific named sections.

Uploaded by

Ahmed Shams

We take content rights seriously. If you suspect this is your content, claim it here.

Available Formats

Download as PDF, TXT or read online on Scribd

0% found this document useful (0 votes)

13 views15 pages

Layout

Uploaded by

Ahmed Shams

We take content rights seriously. If you suspect this is your content, claim it here.

Available Formats

Download as PDF, TXT or read online on Scribd

You are on page 1/ 15

MVC

Christen Zarif Foad

OutLine
• Layout
Layout View
Layout View
• An application may contain common parts in the UI
which remains the same throughout the application such
as the logo, header, left navigation bar, right bar or footer
section.
• ASP.NET MVC introduced
a Layout view which
contains these common
UI parts
• Bootstrap templates
• http://bootswatch.com/
• Free Bootstrap Themes, Templates, Snippets, and Guides - Start Bootstrap
Layout View (Con.)
• The layout view allows you to define a common site
template, which can be inherited in multiple views to
provide a consistent look and feel in multiple pages of an
application.
• The layout view eliminates duplicate coding and
enhances development speed and easy maintenance

• The razor layout view has same extension as other

views, .cshtml or .vbhtml

• Layout views are shared with multiple views, so it must

be stored in the Shared folder.
Use Layout view (con.)

– @Layout property in individual view

• override default layout page set by _ViewStart.cshtml
by setting Layout property in each individual .cshtml
view.

– Specify Layout page in ActionResult method:

_ViewStart.cshtml
• You can set the layout view by :
– _ViewStart.cshtml:
• It sets up the default layout page for all the views in the
folder and its subfolders using the Layout property
• all the views derived default layout page from
_ViewStart.cshtml of Views folder.

• _ViewStart.cshtml can also be included in sub folder of

View folder to set the default layout page for all the
views included in that particular subfolder only.
General Notes
• Naming convention for layouts is to prefix the file
with an underscore (_) character

• Layout files are placed in the /Views/Shared folder

• All views applied this Layout by default, through the

/Views/_ViewStart.cshtml file

• @{Layout=null} property
Rendering Methods

Method Description
RenderBody() • Renders the portion of the child view that is not within a
named section. Layout view must include RenderBody()
method.
• RenderBody can be used only once in the layout view,
whereas
RenderSection(strin • Renders a content of named section and specifies whether
g name) the section is required. RenderSection() is optional in
Layout view.
• the RenderSection method can be called multiple time
with different name.
• Use @section name to create section in view
• RenderSection can be configured as required or optional.
If required, then all the child views must included that
named section
Layout page – section overrides
Create Layout View
Create Layout
To add Client Side Library
• To Upload Image:
– https://rachelappel.com/category/asp-net-mvc/

• Use ViewData and Implement ViewModel Classes

– https://docs.microsoft.com/en-
us/aspnet/mvc/overview/older-versions-1/nerddinner/use-
viewdata-and-implement-viewmodel-classes
• Pagination in mvc5
– https://www.youtube.com/watch?v=srN56uxw76s