开发者

jQuery impromptu: Form getting submitted even before Yes or No ic clicked

开发者 https://www.devze.com 2023-01-05 17:00 出处:网络
I am using jquery Impromptu for submitting one of my forms. In the above mentioned URL I am using the Example 2.

I am using jquery Impromptu for submitting one of my forms. In the above mentioned URL I am using the Example 2.

Now when i try incorporating the same in my form submission, the form is getting submitted even before i clcik on the yes / no button.

I am using the following line of code for the form submit

<input type="image" name="开发者_运维技巧delete" src="images/delete.png" onclick="$.prompt('Are you sure??',{ buttons: { Ok: true, Cancel: false } })">

I am sure I am missing out on something. Can someone please help me?

Thanks,
Alloi


Try something like this:

<input type="image" name="delete" src="images/delete.png" onclick="$.prompt('Are you sure??',{ buttons: { Ok: $('form#foo').submit(), Cancel: false } }); return false;">

Even better, try to make your JS unobstrusive:

<input type="image" name="delete" src="images/delete.png" />

 

$('input[name=delete]').click(function() {
    $.prompt('Are you sure??',{
        buttons: {
            Ok: $('form#foo').submit(),
            Cancel: false
        }
    });
    return false;
});


Impromptu doesn't wait before execution. So you shouldn't submit before user confirms operation.

Use like this:

<input type="image" name="delete" src="images/delete.png" onclick="confirmAndDelete()">

with the javascript function:

function confirmAndDelete(){

    var deleteFunc = function()
    {
        $('form#foo').submit();
    };

    $.prompt("Are you sure?", 
             {
               title: "Delete Confirm",
               buttons: { "Yes": true, "No": false },
               submit: function (e, val, m, f) {                            
                            if (val == true)
                                deleteFunc();
                            else
                                console.log('Delete not confirmed!');
                        }
              });

}


Fancy prompts like this show a message on/over the page, but they don't suspend execution like alert and confirm do. (This is what they mean on the docs page when they say " This is not intended to be a modal replacement...") So although you're showing the prompt, the form submission continues.

The usual way to handle this is to show the prompt but cancel the form submission, and then submit the form programmatically if the user says "Yes."

Basically, you:

  • Set up a submit handler on the form so that it cancels the submission if it's told to
  • Set up the image click to tell the form to cancel the submission and show the prompt instead
  • Set up a handler on the prompt's "Yes" button to submit the form
0

精彩评论

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