Skip to content

html5 overriding custom validation #371

@FireSBurnsmuP

Description

@FireSBurnsmuP

I have created a custom validator to handle the problem described in #158 as below:

$.formUtils.addValidator({
    name: 'group_one_required',
    validatorFunction: function (value, $el, config, language, $form) {
        if (value != '') {
            return true;
        }
        else {
            var $others = $($el.data('groupothers')),
            valid = false, i;
            for (i = 0; i < $others.length; i++) {
                var $this = $($others[i]);
                if ($this.val() != '') {
                valid = true;
            }
        }
        return valid;
        }
    },
    errorMessage: 'One of these values must be provided.',
    errorMessageKey: 'badGroupOneRequired'
});

And let's say I have the following inputs:

<input id="One" type="number" min="0" max="5"
    data-validation="group_one_required" data-groupothers="#Other">
<input id="Other" type="number" min="0" max="5"
    data-validation="group_one_required" data-groupothers="#One">

This is simplified, but will work just the same. If I initialize validator without HTML5 module enabled, with $.validate(); this validator functions. However, if I do use the HTML5 module ($.validate({modules: 'html5'});) my validatorFunction never gets called, as the call to $.validate({...}) changes

<input id="One" type="number" min="0" max="5"
    data-validation="group_one_required" data-groupothers="#Other">

to

<input id="One" type="number" min="0" max="5"
    data-validation="number" data-groupothers="#Other"
    data-validation-allowing="range[0;5]" data-validation-optional="true">

The expected functionality would be for the HTML5 module to append its rules to data-validation, effectively adding the HTML5 validation rules, instead of overwriting the attribute, effectively replacing any existing validation rules.

That is, the desired result would be

<input id="One" type="number" min="0" max="5"
    data-validation="group_one_required number" data-groupothers="#Other"
    data-validation-allowing="range[0;5]" data-validation-optional="true">

This would allow both validators to function. Could this be at least an option? I couldn't find anything on the site or README about it.

I have another issue with my custom validator, but that will be in its own issue.

Thanks as always for your time.

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions