I've been trying to adapt the validator from this example in a LR 6.2 GA6 Portlet. However, I can't get it to work. Curiously the validator-tag isn't working as well.
This is the form I've been using
<aui:form name="<portlet:namespace />address" action="<%=doSmthURL %>" id="fm">
<aui:container>
...
<aui:row>
<aui:col>
<aui:input name="conditions1" label="text" type="checkbox" id="conditions1">
</aui:input>
</aui:col>
</aui:row>
<aui:row>
<aui:col>
<aui:input name="conditions2" label="conditions2" type="checkbox" id="conditions2"/>
</aui:col>
</aui:row>
</aui:container>
<aui:button-row>
<aui:button type="cancel" value="Back"></aui:button>
<aui:button type="submit" value="Finish"></aui:button>
</aui:button-row></aui:form>
And this is the Aui:Script part
<aui:script>
var rules = {
conditions1:{
required:true
},
conditions2:{
required:true
}
}
var fieldStrings = {
conditions1:{
required:"Bitte nimm die allgemeinen Geschäftbedingungen an"
},
conditions2:{
required:"Bitte nimm die allgemeinen Geschäftbedingungen an"
}
}
AUI().use(
'aui-form-validator',
function(A) {
new A.FormValidator(
{
boundingBox: "#fm",
fieldStrings: fieldStrings,
rules: rules,
showAllMessages: true
}
)
}
);
I am not sure why it isn't working. Since using a validator tag isn't doing anything as well maybe it is a problem with javascript excecution as a whole.
I hope someone can help me.
Kind regards, JSM
Sorry, that documentation is confusing, and needs to be updated.
If you are able, I'd suggest using the <aui:validator>
inside the <aui:input>
.
<aui:input name="conditions1" label="text" type="checkbox" id="conditions1">
<aui:validator name="required" errorMessage="Bitte nimm die allgemeinen Geschäftbedingungen an" />
</aui:input>
This way Portal is handling all the necessary JS.
If you can't use <aui:validator
, I'd suggest using Liferay.Form
to access the Form Validator attached to the form. Because currently, you're attaching an additional one, which may conflict.
<aui:script use="liferay-form">
var form = Liferay.Form.get('<portlet:namespace />fm');
var oldFieldRules = form.get('fieldRules');
var newFieldRules = [
{
body: function (val, fieldNode, ruleValue) {
return (val !== '2');
},
custom: true,
errorMessage: 'must-not-equal-2',
fieldName: 'fooInput',
validatorName: 'custom_fooInput'
},
{
fieldName: 'fooInput',
validatorName: 'number'
}
];
var fieldRules = oldFieldRules.concat(newFieldRules);
form.set('fieldRules', fieldRules);
</aui:script>