Search code examples
javascriptjqueryevent-handlingclient-sideconfirmation

Two button confirmations - Jquery


Currently I have a submit button that pops up a confirmation that allows the form data to be processed or not.

I need my other button on my form page called "Cancel" to have the same action. How could I expand this code to add a second confirmation to the same form?

these are my buttons on the form :

enter image description here

And this is my current code that works :

 </script>
        <script>
            $(document).on('submit', "#signinform", function(e)
            {
                if (!confirm("By clicking 'OK' you will be placed in queue! Please take a seat."))
                {
                    e.preventDefault();
                    return;
                }
            });
        </script>

just to add on :

The submit is a submit BUTTON. the Cancel is just a href with a border around it.

also again

This works at the moment for just the submit button.

I need my other button on the form called "Cancel" to do the samething, as in if you hit Ok your submission data will be deleted, and then you will be returned back to the form. If you hit cancel then you will remain on the page.


Solution

  • I guess you simply need something like

    $(document).on('click', "#cancelButtonID", function(e)
    {
        if (!confirm("By clicking 'OK' you cancel the submission and the form is cleared."))
        {
            e.preventDefault();
            return;
        }
        else {
            //Clear the form or perform whatever actions are needed
        }
    });
    

    I think however that you may want to replace your cancel link with a proper <input type="reset"> button, as that will clear the form automatically when you let the default action happen. Then you should be able to get rid of the else section above.