Home > DeveloperSection > Articles > Calling partial view using Ajax in ASP.NET MVC 4

Calling partial view using Ajax in ASP.NET MVC 4


ASP.NET MVC ASP.NET MVC 
Ratings:
0 Comment(s)
 40502  View(s)
Rate this:

Calling Partial View Using Ajax in ASP.NET MVC 4


In this blog I have described how to render partial view using Ajax method within any control. Ajax provides flexibility to render page without post back. Steps are given below

Step 1: First create partial view. For demonstration I have created “_server” partial view in Shared folder.

Step 2: Create action in your controller. Here I have created action “Server” in Home controller.

public PartialViewResult Server()

 {

            return PartialView("_server");

 }

 

Step 3: Now come to your View and call Partial View. For demonstration, I have call partial view from Index view and write below line of code.

 

Using ActionLink

 

<div id="atag">

@Ajax.ActionLink("Click", "Server", "Home", new AjaxOptions { UpdateTargetId = "atag" })

</div>

 

Using Submit Button

 

<div id="btnsubmit">

@using (Ajax.BeginForm("Server", "Home", new AjaxOptions { UpdateTargetId = "btnsubmit" }))

        {

            <input type="submit" value="Click" />

        }

</div>

Note:

Add below script that required for execute Ajax attribute

<script src="../../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>

<script src="../../Scripts/modernizr-2.5.3.js" type="text/javascript"></script>

 


Don't want to miss updates? Please click the below button!

Follow MindStick