Ajax Action Link instead of Html Action link in MVC 5

Question

I have many select queries on my Page and few Action links based on them used gets another data tab wise.

Example on stack over flow when we see the profile of the user we see

summary questions answers tags badges etc.

If a user clicks on any one of the tab it hits the entire action and all the other sections of the pages hits the database which results in increase in load time of the page.To improve the performance I thaught to apply ajax,so after searching I got this example.

Partial View.

@model IEnumerable<AJAX.Models.tblStudent>
<table>
@foreach (var item in Model)
{
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.Age)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Name)
        </td>
    </tr>
}
</table>
<h2>Time is @DateTime.Now</h2>

Controller

public ActionResult Index()
{
    return View();
}

public PartialViewResult Twenty()
{
    var result = from r in db.tblStudents where r.Age == 20 select r;
    return PartialView("_Country", result);
}

public PartialViewResult TwentyFive()
{
    var result = db.tblStudents.Where(x => x.Age >= 25);
    return PartialView("_Country", result);
}

Index View

@{
    ViewBag.Title = "Home Page";
}

@Ajax.ActionLink("Age 20", "Twenty", new AjaxOptions
{
    UpdateTargetId = "StudentList", 
    InsertionMode = InsertionMode.Replace, 
    HttpMethod = "GET"
})

@Ajax.ActionLink("Age 25", "TwentyFive", new AjaxOptions
{
    UpdateTargetId = "StudentList", 
    InsertionMode = InsertionMode.Replace,
    HttpMethod = "GET" 
})
<div id="StudentList"></div>

 <h2>Time is @DateTime.Now</h2>
 @section scripts{
 @Scripts.Render("~/Scripts/jquery.unobtrusive-ajax.min.js")
 }

This works fine and have added date time to cross check whether the clicked page hits the database leaving the other sections of the page.Would like to know whether its a correct way of using Ajax in MVC. As have Ajax.ActionLink.

Note : this tutorial

Answer 1

it up to your application situation. You can see this post just i found.

In the amount of code you have to write (less with Ajax.ActionLink) and the level of control you need (more with Html.ActionLink and a jquery ajax call).

So it's amount of code vs level of control and functionality needed => up to you to decide which one you need.

Both approaches are perfectly fine. The Ajax.ActionLink uses the jquery.unobtrisuve-ajax script to AJAXify the anchor behind the scenes.

Personally I always use Html.ActionLink + jQuery.

collectted. See this links

link1

link2

link3