CODEWITHSUNDEEP
c#javascriptjqueryasp.net-mvc
user3244544
user3244544

Reputation: 109

Form submit not triggering method from controller

I have a list of users that i will add the ability to remove users from but with what i currently have - the form is not doing what it is supposed to do: that is to trigger the delete method from the api controller. I am not getting any errors on the page nor in the console and not sure what i could be doing wrong:

<form  data-submit-button="#userRemoveSubmit"  id="userRemoveForm" action="/api/UserRemove/" class="ajax" method="delete" data-overview-id="@ViewBag.OverViewID" data-bind="attr: { 'data-user-id': ID(), 'data-type-id': TypeId() }">
    .......
</form>

<a id="userRemoveSubmit" title="Remove User"><b>REMOVE</b></a>

Controller:

public HttpResponseMessage Delete(TypesList typeInfo)
{
 ........
}

TypeList Model: 

public class TypesList
{
  public int UserId { get; set; }
  public int TypeId { get; set; }
  public int? OverViewId { get; set; }
}

How can i properly make them all connect together so that when i click on remove it triggers the delete method in the controller?

Upvotes: 0

Views: 116

Answers (2)

Mister Epic
Mister Epic

Reputation: 16713

You should use AJAX, and send a DELETE request:

$('#userRemoveSubmit').click(function(e){
    e.preventDefault(),
    $.ajax({
        url: '/api/UserRemove/',
        type: 'DELETE',
        data: { typeInfo : YOURVARIABLEHERE }
    }).done(function() {
         alert( "success" );
    })
    .fail(function() {
         alert( "error" );
    })
    .always(function() {
         alert( "complete" );
    });
});

ref: http://api.jquery.com/jquery.ajax/

Upvotes: 0

Andy T
Andy T

Reputation: 9881

The problem is th action="delete" in the form tag.

Browsers usually can only perform GET or POST for the form elements (unless you are submitting it using AJAX).

Please take a look at this answer so you can see a workaround: DELETE method not working

Upvotes: 1

Related Questions