50

First of all, where is the documentation for Ajax.* methods in asp.net mvc?

Can Ajax.ActionLink be used to call an action, get a partial view, open a modal window and put the content in it?

1

4 Answers 4

61

Sure, a very similar question was asked before. Set the controller for ajax requests:

public ActionResult Show()
{
    if (Request.IsAjaxRequest()) 
    {
        return PartialView("Your_partial_view", new Model());
    }
    else 
    {
        return View();
    }
}

Set the action link as wanted:

@Ajax.ActionLink("Show", 
                 "Show", 
                 null, 
                 new AjaxOptions { HttpMethod = "GET", 
                 InsertionMode = InsertionMode.Replace, 
                 UpdateTargetId = "dialog_window_id", 
                 OnComplete = "your_js_function();" })

Note that I'm using Razor view engine, and that your AjaxOptions may vary depending on what you want. Finally display it on a modal window. The jQuery UI dialog is suggested.

2
  • 1
    you should also put "your_js_function()" in your answer. Feb 1, 2017 at 7:45
  • What would I do in the case Where I want to use image as the anchor display instead of the word show?
    – Mwas
    Sep 13, 2017 at 13:23
45

@Ajax.ActionLink requires jQuery AJAX Unobtrusive library. You can download it via nuget:

Install-Package Microsoft.jQuery.Unobtrusive.Ajax

Then add this code to your View:

@Scripts.Render("~/Scripts/jquery.unobtrusive-ajax.min.js")
4
  • This was the key point I don't find in the other documentation.
    – Rozwel
    Aug 8, 2014 at 16:31
  • @Rozwel I couldn't find it anywhere either. What an obscure "gotcha". Tip for Microsoft: don't do this. Sep 7, 2016 at 21:51
  • do this first , add this nugget package even if you are in VS 2017, this issue exists, we have to manually add this package to the project for anything with @Ajax to work in your cshtml Jan 18, 2018 at 8:17
  • Well, +1 for this as all answers failed to add this key point about the Library.
    – Garry
    Oct 27, 2018 at 20:43
9

For me this worked after I downloaded AJAX Unobtrusive library via NuGet :

 Search and install via NuGet Packages:   Microsoft.jQuery.Unobtrusive.Ajax

Than add in the view the references to jquery and AJAX Unobtrusive:

@Scripts.Render("~/bundles/jquery")
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"> </script>
6

Ajax.ActionLink only sends an ajax request to the server. What happens ahead really depends upon type of data returned and what your client side script does with it. You may send a partial view for ajax call or json, xml etc. Ajax.ActionLink however have different callbacks and parameters that allow you to write js code on different events. You can do something before request is sent or onComplete. similarly you have an onSuccess callback. This is where you put your JS code for manipulating result returned by server. You may simply put it back in UpdateTargetID or you can do fancy stuff with this result using jQuery or some other JS library.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.