CODEWITHSUNDEEP
c#asp.netasp.net-mvc-3razorroutes
Bill Martin
Bill Martin

Reputation: 4943

Ajax.ActionLink not calling controller action

I'm displaying a list of files and allowing the user to delete from the list. The delete button does an ajax call to the controller to run the 'Delete' action. However, the delete action is never called.I am getting the confirmation alert defined in AjaxOptions. For what it's worth, I had this working using the WebForms engine and just moved it to Razor. Also, this is the first time I've used Areas. If I call the Delete action directly, it works. Is this a routing issue?

Here's the code behind

  public EmptyResult Delete(string fileName)
    {
        if (fileName.IsNullOrEmpty()) return null;
        var model = new Models.BenefitBookletModel();
        model.DeleteBooklet(fileName);
        return null;
    }

Here's the mark up

    @Ajax.ActionLink("test", "Delete", new { fileName = item.FileName }, new AjaxOptions
                                                                                 {
Confirm = "Are you sure you want to delete " + item.FileName + "?",
OnComplete = "function(){deleteComplete('" + item.jsReferenceableFileName + "')}",
HttpMethod = "DELETE",
OnFailure = "function(){alert('Could not delete file');}"
              }, new { @class = "DeleteButton" }
                                                                             )

Here is my RegisterRoutes

        routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
        routes.MapRoute("SubscriberAll","subscriber/{id}",new { controller = "Subscriber", action = "ShowAll" },new { id = @"\d+" } );
        routes.MapRoute("Default", "{controller}/{action}/{id}", new { controller = "Home", action = "Index", id = UrlParameter.Optional });

Routes from area registration

context.MapRoute("Marketing_default","Marketing/{controller}/{action}/{id}",new { action = "Index", id = UrlParameter.Optional }

Here is the markup generated

<a href="/Marketing/BenefitBooklet/Delete?fileName=MyFileName.pdf" data-ajax-method="GET" data-ajax-failure="function(){alert('Could not delete file');}" data-ajax-confirm="Are you sure you want to delete MyFileName.pdf?" data-ajax-complete="function(){deleteComplete('MyFileName.pdf')}" data-ajax="true" class="DeleteButton"> </a>

Upvotes: 4

Views: 2150

Answers (2)

WarHog
WarHog

Reputation: 8710

You should specify the function name as the value of the corresponding AjaxOptions property. Add script section:

<script type="text/javascript">
    function OnFailure(request, error) {
        alert('Could not delete file');
    }
    function OnComplete(request, error) {
        alert('Delete complete');
    }
</script>

in your view and change OnFailure and OnComplete in 'AjaxOptions':

OnFailure = "OnFailure"
OnComplete= "OnComplete"

Upvotes: 4

James Hull
James Hull

Reputation: 3689

You are defining the HttpMethod of the Action Link to be DELETE but you method probably only accepts GET. Try decorating it with the Delete action verb.

[HttpDelete]
public EmptyResult Delete(string fileName)

Upvotes: 1

Related Questions