05 July, 2012

pjax with MVC, and form post like pjax

Last weekend I was working on a interesting project, and came across an interesting JavaScript library called pjax.

More information on pjax:

https://github.com/defunkt/jquery-pjax/

http://pjax.heroku.com/

pjax loads HTML from your server into the current page without a full reload. It's ajax with real permalinks, page titles, and a working back button that fully degrades, It just enhances the browsing experience.

I just loved the way we could use it with MVC; Below code sample explains how we could use the
same with MVC.
Clientside code would look as below:


    

Since the Form post is not handled with pjax, we can do a work around as below.


Updated _ViewStart.cshtml as below:
@{
    if (Request.Headers["X-PJAX"] != null || Request.Headers["AJAX-FORM"]!=null)
    {
        Layout = "~/Views/Shared/_PjaxLayout.cshtml";
    }
    else
        {
        Layout = "~/Views/Shared/_Layout.cshtml";
    }
}

_PjaxLayout.cshtml page content can be as simple as abelow
@{
    ViewBag.Title = "_PjaxLayout";
}
@RenderBody()