Load ASP.NET MVC partial views on link click

Posted by Anuraj on Sunday, March 15, 2015

.Net ASP.Net MVC Javascript

Some one asked me how we can load partial views on link click. Here is the snippet for the same.

Long version - Using JQuery

<script type="text/javascript">
$("#loadPartialView").click(function () {
    $.get('@Url.Action("LoadPartialView","Home")', {}, function (response) {
        $("#Display").html(response);
    });
});
</script>

And here is the small version using Ajax.ActionLink

@Ajax.ActionLink("Load Partial View", "LoadPartialView", "Home",
    new AjaxOptions() { UpdateTargetId = "Display" })

In the page, you need to add a DIV with Id attribute which got a value “Display”, partial view will be loaded to this DIV.

And here is the controller action

public ActionResult LoadPartialView()
{
    return PartialView("_PartialView");
}

Happy Programming :)



Did you like this article? Share it with your friends

Facebook Twitter Google+ LinkedIn Reddit StumbleUpon



MVP
Subscribe


Copyright © 2017 - Anuraj P. Blog content licensed under the Creative Commons CC BY 2.5 | Unless otherwise stated or granted, code samples licensed under the MIT license. This is a personal blog. The opinions expressed here represent my own and not those of my employer. Hosted with ❤ by GitHub