0

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?

user3244544
  • 109
  • 9

2 Answers2

1

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

Community
  • 1
  • 1
Andy T
  • 10,223
  • 5
  • 53
  • 95
0

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/

Mister Epic
  • 16,295
  • 13
  • 76
  • 147
  • i will go ahead and give this a try but i was wondering if i am properly passing in my parameters? – user3244544 Jan 30 '14 at 22:12
  • Updated, as you are typically passing a value to you DELETE Web Api. Also included `e.preventDefault()`, which will prevent the form from submitting. – Mister Epic Jan 30 '14 at 22:53