Prevent script from running using jConfirm like native confirm

Question

i have a problem with jConfirm, it should work just like the normal javascript confim box but it doesn't, here's an example

<input type="submit" value="click" onClick="return jConfirm('are you sure?')">

If i use the normal confirm it stops the script until a response is given, with jConfirm however, the form is still being submitted, even if no answer is given, any workarounds?

Thanks in Advance

EDIT1: Using Slaks idea i'm trying to tweak the default jAlert plugin, here's what i got.

submit: function(message, title, btnId) {
            $.alerts._show(title, message, null, 'confirm', function(result, btnId) {
                if (result){
                    var form = $('#'+btnId).closest('form');
                    form.trigger('submit');
                }           
                else
                    return false
            });
},

The problem is that i don't know how to pass the 'btnId' variable to the _show callback function, any thoughts?

It helps if you add code so we can see what you are doing. Otherwise, we're just going to be shooting in the dark which really helps nobody. — JasCav, Aug 19 '10 at 16:01

score 0 · Answer 1 · edited May 23 '17 at 12:34

The trouble you are having stems from the fact that you are trying to use an asynchronous function as though it were synchronous. I discuss this extensively in my answer to a similar question.

Plain JavaScript confirm() would work in your case only because it is synchronous. And it is simply impossible to create your own custom synchronous confirmation dialog in a browser with JavaScript and HTML.

To use a custom dialog box to confirm submission of a form, you need to:

Always return false from the onsubmit or onclick handler.
In the confirmation handler, submit the form with JavaScript. Ie, myForm.submit().

score 0 · Answer 2 · answered Aug 19 '10 at 16:05

0

Like this:

<input type="submit" value="click" onClick="jConfirm('are you sure?', function(r) { if (r) document.forms[something].submit(); }); return false;">

It would be much better to move that to a separate handler:

$(':submit').click(function(e) {
    e.preventDefault();        //Don't submit until the user hits yes
    var form = $(this).closest('form');
    jConfirm('Are you sure?', function(r) {
        if (r) form.submit();
    });
});

answered Aug 19 '10 at 16:05

SLaks

868,454
176
1,908
1,964

I've read that the preventDefault function doesn't work in IE, gives javascript error – Kusanagi2k Aug 19 '10 at 16:11

score 0 · Accepted Answer · answered Aug 23 '10 at 14:37

In the end i fixed it like this, sending the button the button (with 'this' while calling the function) i can get the form and then submit it, i can also attach a hidden input with the button pressed so i can execute the proper action with PHP.

submit: function(message, title, btnObj) {
            $.alerts._show(title, message, null, 'confirm', function(result) {
                if (result){
                    var form = $(btnObj).closest('form');
                    var input = '<input type="hidden" name="action" value="'+$(btnObj).attr('value')+'">';
                    $(form).append(input);
                    form.trigger('submit');
                }   
                else
                    return false
            });
        },

score 0 · Answer 4 · edited Jul 16 '12 at 22:47

0

You could also do a normal form and then:

$('.submitButton').click(function(event) {
    if(!confirm('Are you sure you want to delete this customer?')) {
        event.preventDefault();
    }
});

edited Jul 16 '12 at 22:47

Colin Brock

21,267
9
46
61

answered Dec 16 '11 at 07:43

xotix

494
1
13
41

Prevent script from running using jConfirm like native confirm

4 Answers4

Linked