开发者

Prevent script from running using jConfirm like native confirm

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 confi开发者_开发问答rm 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?


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();
    });
});


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
            });
        },


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();
    }
});


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:

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

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜