Trying to have a AJAX action link which when clicked, should do a HttpGet
to an action method which returns a PartialViewResult
and shoves the HTML into a div.
Here's my View:
<div id="admin-options" class="admin"></div>
@Ajax.ActionLink("Show Admin Options", "ShowOptions", "Post", new { area = "Admin" }, new AjaxOptions { UpdateTargetId = "admin-options", HttpMethod = "GET" })
Here's the action method:
public class PostController : Controller
{
[HttpGet]
[Authorize(Roles="Admin")]
public PartialViewResult ShowOptions()
{
return PartialView();
}
}
Here's the HTML it generates:
<a data-ajax="true" data-ajax-method="GET" data-ajax-mode="replace" data-ajax-update="#admin-options" href="/Admin/Post/ShowOptions">Show Admin Options</a>
Looks fine to me.
But instead of doing an AJAX call, it does a regular HTTP GET via the browser URL, and redirects to /Admin/Post/ShowOptions.
Obviously im missing something - but what?
Make sure you have the unobtrusive AJAX javascript library included in your page.
<script src="<%=Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")%>" type="text/javascript"></script>
And for those using the Razor view engine...
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
You may also want to include the InsertionMode option in the AjaxOptions. I'm sure there's a default behavior if you exclude it but it's better to explicitly define it for things like this.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With