CODEWITHSUNDEEP
asp.net-mvcrazor
Justin Dearing
Justin Dearing

Reputation: 14938

Setting the DELETE verb for @Ajax.ActionLink

I have a link in ASP.NET MVC that looks like this:

@Ajax.ActionLink("Delete", "Delete", new { id = item.Id }, new AjaxOptions { HttpMethod = "DELETE" })

However, when i click it it behaves like a GET link and chrome debugger says this: GET http://localhost:22148/CreditCards/Delete/2001 404 (Not Found)

The html that gets generated by the razor template is 

<a data-ajax="true" data-ajax-method="DELETE" href="/CreditCards/Delete/2001">Delete</a>

It seems to be using html5 to indicate that it should be a delete call. How do I make a delete call happen?

Upvotes: 1

Views: 852

Answers (1)

Justin Dearing
Justin Dearing

Reputation: 14938

The javascript package that handles the data-ajax and data-ajax-method attributes is The microsoft unobtrusive ajax package for jquery. To enable it you need to do the following.

First install the nuget package with Install-Package Microsoft.jQuery.Unobtrusive.Ajax from the package manager console.

Then add the bundle to RegisterBundleCollection() in App_Start/BundleConfig.cs like so:

    bundles.Add(new ScriptBundle("~/bundles/jqueryajax").Include(
            "~/Scripts/jquery.unobtrusive-ajax*"));

Finally, include this bundle and the jquery bundle _Layout.cshtml:

dd Scripts.Render("~/bundles/jquery")
dd Scripts.Render("~/bundles/jqueryajax")

While jquery is included as a nuget package with ASP.NET MVC packages, its not included in the views by default

At that point your Action link will perform a DELETE instead of a GET.

Upvotes: 1

Related Questions