@Ajax.actionlink in MVC 4

Hemraj Rav

9y1.6kAJAX

Hi,

please see below code , when clickon this link why it replaces entire page ratherthan target id "idDev".

I tried latest script also, but still same issue.It replace entire page with layout page content also.

can anybody suggests.

ViewBag.Title = "TestAjax";

Layout = "~/Views/Shared/_Layout.cshtml";

}

TestAjax

@Ajax.ActionLink("Click Ajax", "TestAjaxLink", new AjaxOptions {

UpdateTargetId = "idDev",

InsertionMode = InsertionMode.Replace

})

@ViewBag.TitleName

please see below screen shot also.

Thanks in advance.

Regards

Hemraj

5 Replies

Know the answer? Post it — somebody with the same question will find it here.

Manas Mohapatra9y ago
Accepted answer
To resolve your issue:

1. Provide correct HTTP method
2. Add jQuery unobtrusive js file to implement AJAX
3. Return data partial view result not view result.
@Ajax.ActionLink("Customer from India", // <-- Text to display
                 "India", // <-- Action Method Name
                 new AjaxOptions
                 {
                     UpdateTargetId="CustomerList", // <-- DOM element ID to update
                     InsertionModeInsertionMode = InsertionMode.Replace, // <-- Replace the content of DOM element
                     HttpMethod = "GET" // <-- HTTP method
                 })

<div id="CustomerList">div>

@section scripts{
    @Scripts.Render("~/Scripts/jquery.unobtrusive-ajax.min.js")
}
Next to define, action with returning data as partialview result, follow below code..
public PartialViewResult India()
{
    var result = from r in db.Customers
                    where r.Country == "India"
                    select r;
    return PartialView("_Country", result);
}
http://www.c-sharpcorner.com/UploadFile/manas1/sending-partialview-using-jquery-ajax-request-in-Asp-Net-mvc/
If it helps please accept the answer..
Hemraj Rav9y ago
Hi Manas,

Thanks, Actually i wanted to know some complex form code, but that's fine.

again thanks for your time.

Best Regards

Hemraj
Hemraj Rav9y ago
Hi Manas,

Thanks, but still i have to know, can you provide some raw code that clarify.

Best Regards

Hemraj
Manas Mohapatra9y ago
There are multiple ways to do..you can send multiple AJAX request to get data for multiple models or create a complex entity which holds all entity which required in ur current page. On single shot call AJAX, with the partial view and model as well. Now you will have complete data in client-side.
Hemraj Rav9y ago
Hi Manas,

Thanks, now it's working fine. but i we have multiple entity inside view model then how we will handle in multiple partial views like sales request, invoice form so there are multiple popup as well, then how can handle any suggestion.

Regards

Hemraj