jqueryformsconfirm

Confirmation before submitting form using jQuery


I am trying add a confirmation before a form is submitted using jQuery. I found a nice example in another Stack Overflow question form confirm before submit but I can't get it to work.

jQuery:

$(function() {
    $('form#delete').submit(function() {
        var c = confirm("Click OK to continue?");
        return c;
    });
});

Template:

<form id="delete" action="{% url 'item_delete' item.id %}" method="post">{% csrf_token %}
    <input class="floatright" type="submit" value="Delete" />
</form>

How can we achieve this?


Solution

  • You are submitting the form and after are checking for confirm, you need to the inverse

    JS:

    $(function() {
       $("#delete_button").click(function(){
          if (confirm("Click OK to continue?")){
             $('form#delete').submit();
          }
       });
    });
    

    HTML:

    <form id="delete" action="{% url 'item_delete' item.id %}" method="post">{% csrf_token %}
        <input id="delete_button" class="floatright" type="button" value="Delete" />
    </form>