I have a form and a required field as shown below. I added aui field validator for preventing form from submitting if the required field is empty. But its not working. Somebody please help me.
<aui:form id="fm" name="fm" method="post" action="<%= someURL %>">
<aui:input id="txtArea" label="value" name="preferences--txtArea--" type="textarea" style="width:330px;height:65px;" >
<aui:validator name="required" />
</aui:input>
<aui:input name="termsAndCondition" id="termsAndCondition" type="checkbox" label="termsAndConditons"/> <br>
<aui:button type="button" value="save" onClick="showDialog()" />
</aui:form>
<aui:script>
function showDialog()
{
var termsAndCondition= A.one('#<portlet:namespace/>termsAndCondition').attr('value');
var r=confirm("Are you sure to change data?");
if (r==true && termsAndCondition=="true")
{
A.one('#<portlet:namespace/>fm').submit();
}
}
</aui:script>
I found mistake in my code.. I used button type = "button" as you can see
<aui:button type="button" value="save" onClick="showDialog()" />
but for using aui field validator work according to requirement, to prevent from submitting the form when required field is empty. use button type="submit". so corrected line is
<aui:button type="submit" value="save" onClick="showDialog()" />
Now its working fine :) :)