Search code examples
javahtmlliferayliferay-7liferay-aui

aui validator not working on form submit in liferay


I have simple form with some field , I just want to validate my field on client side, so I am using and it working on blur event

the issue is when I submit form error message is displayed and form is submit

I am trying to validate on form submit but how I can get to know which validation is failed

<aui:form name="myForm" action="<%=uploadPromotionURL %>" method="post" enctype="multipart/form-data">
<aui:input name="promotionName"  label="Promotion Name">
    <aui:validator name="required" errorMessage="This field can not be empty"/>
</aui:input>
<aui:input name="promotionDesc" label="Promotion Description"/>

<aui:input type="file" name="offerImages" label="Promotion Image" multiple="multiple" accept="image/*" onchange="setUploadSize(this)">
    <aui:validator name="acceptFiles">'jpg,png,tif,gif,jpeg'</aui:validator>
    <aui:validator name="required" errorMessage="Please chhose offer"/>
    <aui:validator name="custom" errorMessage="File size should not be more than 5Mb">
                        function(val,node,junction){
                            if(uploadSize==true){
                                return true;
                            }else{
                                return false;
                            }
                        }
                    </aui:validator>
</aui:input>

    <aui:select label="Promotion Assignment" id="promotionAssignmentId"
        helpMessage="Choose options" name="promotionAssignment"
        multiple="true">
        <c:forEach var="client" items="${clientList}">
            <aui:option value="${client.key}">${client.value }</aui:option>
        </c:forEach>
        <aui:validator name="required"
            errorMessage="Please Select At least One Client " />
    </aui:select>

    <aui:button type="submit" name="submit" value="submit" />


Solution

  • Only use <aui:validator> as the body of <aui:input> tags. For tags other than that, there are other approaches.

    If you only need required field validation for the dropdown list, I would suggest you use the required="true" attribute in the <aui:select> tab. Doing so would display the default This field is required message.

    Should you need a custom error message, then you would have to use <aui:script> for form validation:

    <aui:script use="aui-form-validator">
        new A.FormValidator({
            boundingBox: $("<portlet:namespace />myForm"),
            rules: {
                <portlet:namespace />promotionAssignment: {
                    required: true
                }
            },
            fieldStrings: {
                <portlet:namespace />promotionAssignment: {
                    required: 'Please select at least one client'
                }
            }
        });
    </aui:script>
    

    Here are some references on liferay validations: https://community.liferay.com/forums/-/message_boards/message/17517133 http://www.liferaysavvy.com/2014/01/form-validation-in-liferay.html