CODEWITHSUNDEEP
jqueryyii2active-form
Andreas Hinderberger
Andreas Hinderberger

Reputation: 1525

Yii2 client side form validation

I have a Yii2 ActiveFrom.

Replaced the Submit button with 

    <button class="btn <?= $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary' ?>"
            onclick="submitit();return false;">
        <?= $model->isNewRecord ? 'Create' : 'Update' ?>
    </button>

because i need to show a modal overlay during the time the page is processing in the background. (Please wait...).

$('#rebates-form').yiiActiveForm('validate')

always returns undefined.

Even if i call

$("#rebates-form").data('yiiActiveForm')

after 'validate' the "validated" element is always false, even if the form don't has validation errors.

$('#rebates-form').yiiActiveForm('submitForm')

always return false, even if form got submitted.

How can i trigger my please wait dialog 

$('#pleaseWaitDialog').modal('show');

to show only in the event of sumbiting the from without validation errors?

Upvotes: 3

Views: 6951

Answers (1)

Andreas Hinderberger
Andreas Hinderberger

Reputation: 1525

Following solution is working:

$(document).ready(function () {
    $("#rebates-form").on("beforeSubmit", function (event, messages) {
        $('#pleaseWaitDialog').modal('show');
        return true;
    });
});

function submitit(element) {
    $('#rebates-form').yiiActiveForm('submitForm')
}

Where the extra button witht the submitit function call can also be left out, since the event "beforeSubmit" will trigger anyways.

This event will only be triggered if the form validation was successfull.

(see comment at https://github.com/yiisoft/yii2/blob/master/framework/assets/yii.activeForm.js)

Upvotes: 4

Related Questions