Search code examples
jqueryjquery-form-wizard

jQuery Form Wizard not submitting (or appears not to be)


I have a jQuery form that goes through each step fine, but it does not appear to submit. Here is the code:

        $(function(){
            $("#demoForm").formwizard({ 
                formPluginEnabled: true,
                validationEnabled: true,
                focusFirstInput : true,
                textNext: 'Next',
                formOptions :{
                    url: 'submit.php',
                    type: 'POST',
                    success: function(data){$("#status").fadeTo(500,1,function(){ $(this).html(responseText).fadeTo(5000, 0); })},
                    dataType: 'json',
                    beforeSubmit: function(data){$("#data").html("data sent to the server: " + $.param(data));},
                    resetForm: false
                }   
             }
            );

the BeforeSubmit event triggers, but the success never triggers. The documentation on http://thecodemine.org/ points to here: http://jquery.malsup.com/form/#options-object, and suggests that every option available on malsup.com is available for jQuery Form Wizard.

Any idea why this the status div is never getting updated?

Thanks!

Edit:

Updated JS:

$(function () {
$("#demoForm").formwizard({
    formPluginEnabled: true,
    validationEnabled: true,
    focusFirstInput: true,
    textNext: 'Next',
    remoteAjax: {
        "cc": { // add a remote ajax call when moving next from the second step
            url: 'submit.php',
            type: 'POST',
            dataType: 'json',
            success: function (data) {
                $("#status").fadeTo(500, 1, function () {
                    $(this).html(responseText).fadeTo(5000, 0)
                });
            }
        }
    },
    formOptions: {
        success: function (data) {
            $("#status").fadeTo(500, 1, function () {
                $(this).html(responseText).fadeTo(5000, 0);
            })
        },
        dataType: 'json',
        beforeSubmit: function (data) {
            $("#data").html("data sent to the server: " + $.param(data));
        },
        resetForm: false
    }
});

I now see in my apache logs that the script is calling submit.php, but it doesnt seem to be putting the response on the page.


Solution

  • Solved this issue in a very terrible way. Created an Ajax function and called it using the beforeSubmit option. I dont recommend anyone do this, but as it appears that the success form option does not work, its really all I had left to do.