Join Jess Chadwick for an in-depth discussion in this video Using sections in Razor layouts, part of ASP.NET Core: Razor Pages.
- [Instructor] Using layouts to centralize common markup is a great approach, but sometimes there are parts of that common markup that sit outside of the main body but still need to be customized for each page. The application we're building has a great example of this. The title of each page sits in the header and not in the body so Pages can't easily change it. Luckily Pages are not restricted to rendering content only within the render body method. Razor also offers another method named render section that allows you to define additional sections of content that Pages may control.
To see it in action I'll copy the content that's currently in the title container and replace it with a call to render section. Now this method has one required parameter, the name of the section. I'll call this one title. Then if I save this and then go to the views that use this layout and tell Razor what content I want to render in this section by using the section keyword followed by the name of the section, like this.
Then I can put whatever content I want rendered at this section in the page inside of these braces. Note that it's not really important where in the view I define this section. It could be at the beginning, like this.
I could move it to the end, or anywhere else. Now when I reload the homepage I can see this new content. However, if I hit another view that uses the same layout but does not have this section defined, Razor throws an exception, letting me know that I must define that section. There are two ways to solve this; either I can define this section in each of my views or I can tell Razor that Pages are not required to define content for this section by setting a second optional parameter on the render section method, a Boolean value which indicates whether views are required to define the section.
Keeping in mind that the more required sections that I define, the more complex my Pages have to be, I'll just set this value to false to indicate that this section is not required. With this in place, I can refresh the recipe page and see that error go away. Only now, the title section is missing. In this case, what I really want to do is define some default content in the layout and then allow Pages to override that content by defining a section, but only if they want to.
In order to do that I can use the is section defined method in my layout, like this. First I'll write an if statement that makes a call to the is section defined method, passing in the name of the section that I'd like to check for, in this case title. If this section is defined, go ahead and make a call to the render section method to render the section. Then I'll write an else condition containing some default title markup to show when the given section is not defined.
Now I can navigate to the home page which is defined content in this title section, or any other page in the site which will just show this default title.
- Creating a new application
- Setting up pages
- Rendering dynamic content
- Reusing markup with layouts
- Increasing the maintainability of pages
- Processing data
- Validating input
- Securing an application