Rails Ajax Jquery Delete Soumet une demande Post après

Je suis en train de supprimer une instance de ma Rails de modèle avec l'Ajax.

Il arrive sur le clic d'un bouton et mon code est comme indiqué ci-dessous:

$("#button").click(function(){ 
    $.ajax({
        type: "POST",
        url: "/slot_allocations/" + slotallocation_id,
        dataType: "json",
        data: {"_method":"delete"},
        complete: function(){
            $( "#SlotAllocationForm" ).dialog( "close" );
            alert("Deleted successfully");
        }
    });
});

Je suis capable de le supprimer avec succès, cependant la delete méthode est toujours suivi par un post demande au serveur de créer un nouveau modèle avec les données existantes. Ce sont les requêtes au serveur.

1. POST http://localhost:3000/slot_allocations/1009 [HTTP/1.1 204 No Content  57ms]    
2. POST http://localhost:3000/slot_allocations [HTTP/1.1 302 Found  111ms]
3. GET http://localhost:3000/slot_allocations/1010 [HTTP/1.1 200 OK  185ms]

#1 qui se passe sur le clic sur mon bouton. Cependant, je ne suis pas trop sûr pourquoi #2 et #3 se produire.

Il y a deux boutons dans la vue:

<button id="button">Delete</button>
<div class="actions"><%= f.submit %></div>

source d'informationauteur Butter Beer

  1. 22

    En supposant que votre bouton est à l'intérieur d'un formulaire, en cliquant c'est probablement la présentation de forme, en plus de la cuisson de la requête ajax.

    Ce que vous voulez faire est de prévenir l'action par défaut en cliquant sur le bouton, ce qui est de la soumission du formulaire.

    Changer le function() paramètre function(event)puis ajouter une event.preventDefault() appel:

    $("#button").click(function(event){ 
    $.ajax({
        type: "POST",
        url: "/slot_allocations/" + slotallocation_id,
        dataType: "json",
        data: {"_method":"delete"},
        complete: function(){
            $( "#SlotAllocationForm" ).dialog( "close" );
            alert("Deleted successfully");
        }
    });
    event.preventDefault();
});
  2. 6

    Vous pouvez utiliser:

    type: "DELETE"

    au lieu de:

    type: "POST"

    et supprimer

    data: {"_method":"delete"}