CODEWITHSUNDEEP
jqueryformsuser-interfacesubmit
X9DESIGN
X9DESIGN

Reputation: 783

jquery ui-dialog form submiting not work

var currentForm;
$("#confirm").dialog({
    autoOpen: false,
    title: "First we must ask you!",
    resizable: false,
    width:500,
    height:190,
    modal: true,
    buttons: {
        'Submit for God sake!': function() {
            currentForm.submit();
        },
        Cancel: function() {
            $(this).dialog('close');
        }
    }       
});
$('.clientForm').submit(function(e){
    currentForm = $(this);
    $('#confirm').dialog('open');
    return false;
});

Hello.

I have an form which must submit only after confirmation. To execute this i use ui-dialog method. Problem is that the form don't want submit after ui-dialog appears and visitor must click to confirmation button.

As i look at the code, everething seems to be correct.

Here the link to JSFiddle

Upvotes: 0

Views: 1124

Answers (2)

Ehsan Sajjad
Ehsan Sajjad

Reputation: 62488

It is not posting because of this line return false; in form submit event. This is causing the form to not post.

$('.clientForm').submit(function(e){
        currentForm = $(this);
        $('#confirm').dialog('open');
        return false; // this line will always stop your form from posting
    });

Give the submit button id and write its click event:

 <button id="go" type="submit">Go there</button>

jquery event:

$('#go').click(function(e){
        currentForm = $(this).closest("form");
        $('#confirm').dialog('open');
        return false;
    });

FIDDLE DEMO

Another alternate is to make button type button instead of submit this will not cause your form to be submitted on click:

<button id="go" type="button">Go there</button>

and jquery:

$('#go').click(function(e){
        currentForm = $(this).closest("form");
        $('#confirm').dialog('open'); // no need to return false as button type is not submit
    });

DEMO

Upvotes: 1

Domain
Domain

Reputation: 11808

Everything is correct except $('.clientForm').submit(function(e){.

Replace $('.clientForm').submit(function(e){ with $('.clientForm').click(function(e){. This should work.

Upvotes: 0

Related Questions