Foren
validator for dynamically added fields
Selva kumar, geändert vor 7 Jahren.
validator for dynamically added fields
Junior Member Beiträge: 39 Beitrittsdatum: 23.07.15 Neueste Beiträge
I have a field with the name "material" in my form. This field gets added dynamically in the form on button click. On intial render of the page, the field wont be available in DOm. After button click, i will add a input with the name into the form.
What i need is to add a "required" validator and a custom validator to the new added field.
I tried the below codefor the "required" validator.
var myFormValidator = Liferay.Form.get('<portlet:namespace />materialForm').formValidator;
var myFld = Y.one('#<portlet:namespace/>material');
var err= {};
err.required = 'Material is mandatory';
myFormValidator .addFieldError(myFld , err );
But the above doesnt work. It doesnt bind the the error to the validator.
What i need is to add a "required" validator and a custom validator to the new added field.
I tried the below codefor the "required" validator.
var myFormValidator = Liferay.Form.get('<portlet:namespace />materialForm').formValidator;
var myFld = Y.one('#<portlet:namespace/>material');
var err= {};
err.required = 'Material is mandatory';
myFormValidator .addFieldError(myFld , err );
But the above doesnt work. It doesnt bind the the error to the validator.
Víctor Ponz, geändert vor 7 Jahren.
RE: validator for dynamically added fields
New Member Beiträge: 14 Beitrittsdatum: 03.12.14 Neueste Beiträge
Try this
Hope it helps
this.formValidator = new Y.FormValidator(
{
boundingBox: Y.one("#" + this.get("formId")),
validateOnInput: true,
validateOnBlur: false,
strings: this.get("STRINGS"),
}
);
var rules = "({";
var rule = "";
//Add your custom rules
if (field.rule.type != ""){
rules += '_86_custom_'+
field.jsName + ': {'+
field.rule.type + ': true,';
if (field.rule.range != "")
rules += 'range:' + field.rule.range + ',';
if (field.rule.rangeLength != "")
rules += 'rangeLength:' + field.rule.rangeLength + ',';
rules += '},';
}
rules += "})";
oSelf.formValidator.set("rules", eval(rules));
oSelf.formValidator.validate();
Hope it helps
Selva kumar, geändert vor 7 Jahren.
RE: validator for dynamically added fields (Antwort)
Junior Member Beiträge: 39 Beitrittsdatum: 23.07.15 Neueste Beiträge
For Default validator
var frmValidator = Liferay.Form.get('<portlet:namespace />materialForm').formValidator;
frmValidator.get('rules')['<portlet:namespace />materialId'] = {required: true, custom: false};
For Custom validator
AUI().use('aui-form-validator', function(A) {
var _validatorConfig = A.config.FormValidator;
if(!_validatorConfig.RULES.custom_id){
A.mix(_validatorConfig.RULES, {
custom_id: function(val, fieldNode, ruleValue) {
if (val < 100) {
return true;
}
return false;
},
}, true);
A.mix(_validatorConfig.STRINGS, {
custom_id: "Material Id is invalid",
}, true);
}
var frmValidator = Liferay.Form.get('<portlet:namespace />materialForm').formValidator;
frmValidator.get('rules')['<portlet:namespace />materialId'] = {custom_id: true, custom: true};
});
var frmValidator = Liferay.Form.get('<portlet:namespace />materialForm').formValidator;
frmValidator.get('rules')['<portlet:namespace />materialId'] = {required: true, custom: false};
For Custom validator
AUI().use('aui-form-validator', function(A) {
var _validatorConfig = A.config.FormValidator;
if(!_validatorConfig.RULES.custom_id){
A.mix(_validatorConfig.RULES, {
custom_id: function(val, fieldNode, ruleValue) {
if (val < 100) {
return true;
}
return false;
},
}, true);
A.mix(_validatorConfig.STRINGS, {
custom_id: "Material Id is invalid",
}, true);
}
var frmValidator = Liferay.Form.get('<portlet:namespace />materialForm').formValidator;
frmValidator.get('rules')['<portlet:namespace />materialId'] = {custom_id: true, custom: true};
});
Byrån Zaugg, geändert vor 7 Jahren.
RE: validator for dynamically added fields
Expert Beiträge: 252 Beitrittsdatum: 06.04.12 Neueste Beiträge
I may be better to have the field always in the DOM, but hidden, and to dynamically required the field when it's displayed.
...
required: function() {
return // check if input displayed
}
...