Get dialog box value to determine submit the form or not

Question

I have a form like this:

<form action="confirm-and-send.php" method="post" onsubmit="return(confirmation());">
    <input a lot of input fields here>
    <button type="submit" name="confirm_and_send" id="submit-button"  class="sent-to-client-bttn" style="margin-left:630px;margin-top: -125px;"></button>
</form>

then I have jquery ui function

function confirmation(){
   $("#some-div").dialog({
        bgiframe: true,
        autoOpen: false,
        minHeight: 200,
        width: 350,
        modal: true,
        closeOnEscape: false,
        draggable: false,
        resizable: false,
        buttons: {
                'Yes': function(){
                    $(this).dialog('close');
                    callback(true);
                },
                'No': function(){
                    $(this).dialog('close');
                    callback(false);
                }
            }
    });
}
function callback(value){
     //do something
}

I am following what they say here and here, but it didn't work for me. If I put event.preventDefault() the yes button will not submit the for; if I don't put it submits the form before i choose any of the two options. Any can give me a proper example?

score 0 · Answer 1 · answered Sep 04 '13 at 07:08

0

i think you are using JqueryUi dialogue box.. it will not work.. for this purpose you have to use this

i explain you what happens when u click ..

it will not stop for ur click .. it will automatically submitted... so u have to try default..browser confirmation

answered Sep 04 '13 at 07:08

Jaimin MosLake

655
1
12
30

AmitS's answer have reached the point. The problem of my codes is not the dialog box, instead it is the structure of my form. Thanks anyway – Andrew Sep 04 '13 at 23:32

Amit Sukapure · Accepted Answer · 2013-09-04T08:24:34.930

0

Take your button outside of the form.

<form action="" method="post" id="my_form" onsubmit="">
        <input type="text" name="x"/>

    </form> 
    <button name="confirm_and_send" id="submit-button" value="Submit" class="sent-to-client-bttn" onclick="confirmation();">Submit</button>
    <div id="some-div" style="display:none">Hi</div>


function confirmation(){


   $("#some-div").dialog({
        bgiframe: true,
        minHeight: 200,
        width: 350,
        modal: true,
        closeOnEscape: false,
        draggable: false,
        resizable: false,
        buttons: {
                'Yes': function(){
                    $(this).dialog('close');
                    callback(true);
                },
                'No': function(){
                    $(this).dialog('close');
                    callback(false);
                }
            }
    });


}
function callback(value){
     alert(value);
}

edited Sep 04 '13 at 08:24

answered Sep 04 '13 at 07:11

Amit Sukapure

359
2
11

And remove `autoOpen: false` – Amit Sukapure Sep 04 '13 at 07:13
Hey, your idea actually is what I need! to put the button out of the form. The only thing left is configure the callback, I put $('#myform').submit() in the call back and it solve the problem. Thanks for your help – Andrew Sep 04 '13 at 23:29
Sorry late reply..! Welcome Andrew..!! – Amit Sukapure Oct 06 '13 at 06:57

Get dialog box value to determine submit the form or not

2 Answers2