Q:

AEM 6.1 Touch UI Dialog - invoke dialog validation event manually

I have some callback on dialog-submited event and I want to find out way to guarantee that dialog will be submitted after my callback (the validation after my callback can inhibit me). Can I pre validate manually whole dialog (every widget) if I'm not aware how much widgets exist on dialog. Maybe there is something in order to invoke this validation?

A:

AEM has made a few methods available to you through a jQuery plugin:
$input.willValidate()
$input.checkValidity()
$input.validationMessage()
$input.setCustomValidity(errorMessage)
$input.updateErrorUI()

For your particular requirement, you can get all the fields in the form, loop through them and check their validity. Use a jQuery selector to find all the form fields; you might have a custom CSS class name on your field elements or you might have a custom Class name on your form for example.
function validateForm() {
    var valid = true;

    /* Select the form fields, will be project specific. */
    var $formFields = $('.dialog-selector .coral-Form-field');

    $formFields.each(function(){
        if (!$(this).checkValidity()) {
            valid = false;

            /* Break out of each loop */
            return false;
        }
    });

    return valid;
}

See this blog post regarding AEM Touch UI Validation and this AEM Touch UI Validation Library on GitHub for more examples.

