Load Partial View as Partial View Result using Ajax in ASP.NET MVC

            In ASP.NET MVC we can return a Partial View in the form of PartialViewResult using the PartialView method.
           The following example shows Partial update scenarios using Ajax.Using jQuery to load the contents of a PartailView in to the current view using an Ajax call. In this example i have load a simple grid using Ajax.
           Controller and Action Result

 public class PartialController : Controller
    {
        //
        // GET: /Partial/

        public ActionResult GetPartialResult()
        {
            var list = new List<Album>
                           {
                               new Album {Title = "Album1"},
                                new Album {Title = "Album2"},
                                 new Album {Title = "Album3"},
                                  new Album {Title = "Album4"}
                           };
            return PartialView(list);
        }

    }

 public class Album
    {
        public string Title { get; set; }
    }


Right click the ActionResult and Create a PartialView like below

@model IEnumerable<Mvc4Demos.Controllers.Album>

<p>
    @Html.ActionLink("Create New", "Create")
</p>
<table>
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.Title)
        </th>
        <th></th>
    </tr>

@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.Title)
        </td>
    </tr>
}

</table>

Here from another view when a button click load the PartialViewResult by using Ajax and Append in to a Result div


<script type="text/javascript">
    $(document).ready(function () {
        $('#btn').click(function () {
            $('#result').load('/Partial/GetPartialResult');
        });
    });

</script>


<input type="button" id="btn" value="PartialExample"/>
<div id="result"></div>