Programming Razor

Changing the Base Class

Despite the great functionality it provides, you will inevitably come across scenarios where the System.Web.Mvc.WebViewPage class simply doesn’t cut it. In cases where you need more functionality than the WebViewPage class offers, Razor provides the @inherits keyword, which lets you specify any base class you want—even your own custom base class. One of the most common uses of the @inherits keyword is to specify a custom base class that extends the WebViewPage class, adding custom functionality through properties and methods.

Let’s say that you have created a bunch of helper methods and you want some kind of shortcut to access your helper methods from within your views. The quickest way to provide easy access to custom helper methods is to write extension methods around the @Html or @Url, since they already exist in the WebViewPage class. However, if you like to keep your helper methods separate from the core ASP.NET MVC functionality, you can choose to create your own helper object that acts much like @Html or @Url, and then add an instance of that custom helper object to a custom base class. The BlogHelper class below shows an example of such a custom helper object. The custom base class (BlogViewPage) exposes the custom helper object via a custom property:

public class BlogHelper
{
    private readonly UrlHelper _urlHelper;

    public BlogHelper(UrlHelper urlHelper) {
        _urlHelper = urlHelper;
    }

    public MvcHtmlString BlogPostLink(int postId) {
        var tag = new TagBuilder("a");
        tag.AddCssClass("blog-post");
        tag.Attributes["href"] = _urlHelper.Action("Post", "Posts");

        return new MvcHtmlString(tag.ToString());
    }
}

namespace MvcRazorBlog {
    public abstract class BlogViewPage : BlogViewPage<dynamic>
    {
    }

    public abstract class BlogViewPage<TModel> : WebViewPage<TModel>
    {
        protected BlogHelper Blog
        {
            get { return new BlogHelper(Url); }
        }
    }
}

The first thing you’ll notice about the custom base class BlogViewPage is that there are actually two of them—one that accepts a generic TModel parameter, and one that is not generic. The reason you should create both is so that you continue to have the option of strongly-typed views. Without the generic version of this class, you would not be able to use the @model keyword to specify the view’s Model type. Likewise, if the nongeneric BlogViewPage doesn’t exist, all of the views that depend on the BlogViewPage custom base class would be required to specify a TModel parameter (i.e., they’d need to be strongly-typed views).

The next thing you’ll notice about BlogViewPage is how tiny it is. Because the aim is to merely extend the core ASP.NET MVC functionality and not replace it, BlogViewPage can derive from ASP.NET MVC’s WebViewPage<TModel> and in doing so, carry along all of the core functionality. With the core functionality in place, BlogViewPage’s only goal is to expose the new custom Blog property, a simple property that just returns a new instance of the custom BlogHelper helper class.

With the BlogViewPage created, referencing it is as simple as adding the @inherits keyword to any Razor views that require it:

View inheriting from custom base class

@inherits MvcRazorBlog.BlogViewPage

<span>Here's a link to Post #123:</span>
@Blog.BlogPostLink(123)

Here you can see that the view inherits from BlogViewPage, then refers to the @Blog.BlogPostLink() method on the custom Blog property.

Warning

ASP.NET MVC does not let you specify both the @inherits keyword and the @model keyword in the same view.

Since ASP.NET MVC does not let you specify both the @inherits keyword and the @model keyword in the same view, you need to specify the model type (the TModel generic parameter) directly in the @inherits statement in order to refer to the strongly-typed version of a custom base class. Thus, to change the previous example from weakly-typed to strongly-typed, you would change its @inherits statement like so:

@inherits MvcRazorBlog.BlogViewPage<AdminViewModel>

The custom base class approach offers greater levels of customization and productivity in your websites. Custom base classes are not only easy to create and reference, but they are also a great way to provide quick and easy access to customized, application-specific functionality across all views in an application. Whenever the default WebViewPage class just doesn’t cut it, consider implementing your own base class!

Applying Custom Base Classes to Multiple Views

When all of your views need to derive from the same custom base class, having to add the @inherits keyword to all of them is not only tedious, but it’s also difficult to maintain. Luckily, ASP.NET MVC offers an alternative approach to specifying the default base class for all Razor views: the system.web.webPages.razor > pages > pageBaseType configuration attribute. To modify this attribute, open the web.config file located in your application’s Views folder, and then locate the line that looks like this: <pages pageBaseType="System.Web.Mvc.WebViewPage">. This is where ASP.NET MVC’s default base page type comes from. To use your own base page type, simply replace the reference to System.Web.Mvc.WebViewPage with the full type name of your base class type (e.g., <pages pageBaseType="MvcRazorBlog.BlogViewPage">). After saving the modified web.config, every view in your application should use your custom base page type.