FormValidator Field Messages

[Faramarz Dorani, modifié il y a 11 années.]

Hello everybody,

I used AllyUI Tutorial Example for FormValidator in my project.
But I encountered some problems. I think my jsp file can't recognize the css classes used in this example. (aui-field-label, ui-field-required, ...)
Furthermore, custom messages don't appear near the input fields.

This is the code:

<form id="myForm">
  <p>
    <label class="aui-field-label" for="name">Name:</label>
    <input class="aui-field-required" type="text" name="name">
  </p>
  <p>
    <label class="aui-field-label" for="email">Email:</label>
    <input class="aui-field-required aui-field-email" type="text" name="email">
  </p>
  <p>
    <label class="aui-field-label" for="age">Age:</label>
    <input class="aui-field-required aui-field-digits" type="text" name="age">
  </p>
  <p>
    <input class="aui-button-input" type="submit" value="Submit">
    <input class="aui-button-input" type="reset" value="Reset">
  </p>
</form>

Could anyone please help me??!!!
I really need to solve it.
Thank you so much.

[Apoorva Prakash, modifié il y a 11 années.]

Faramarz Dorani:

Hello everybody,

I used AllyUI Tutorial Example for FormValidator in my project.
But I encountered some problems. I think my jsp file can't recognize the css classes used in this example. (aui-field-label, ui-field-required, ...)
Furthermore, custom messages don't appear near the input fields.

This is the code:

<form id="myForm">
  <p>
    <label class="aui-field-label" for="name">Name:</label>
    <input class="aui-field-required" type="text" name="name">
  </p>
  <p>
    <label class="aui-field-label" for="email">Email:</label>
    <input class="aui-field-required aui-field-email" type="text" name="email">
  </p>
  <p>
    <label class="aui-field-label" for="age">Age:</label>
    <input class="aui-field-required aui-field-digits" type="text" name="age">
  </p>
  <p>
    <input class="aui-button-input" type="submit" value="Submit">
    <input class="aui-button-input" type="reset" value="Reset">
  </p>
</form>

Could anyone please help me??!!!
I really need to solve it.
Thank you so much.

Please check form.css of theme.

[Faramarz Dorani, modifié il y a 11 années.]

Hi Apoorva Prakash, Thanks for your reply,
But, what did you mean by checking form.css??
I checked it. It is here: liferay-portal-6.1.1-ce-ga2\tomcat-7.0.27\webapps\ROOT\html\css\portal
You mean this file can't be loaded?? or what??

[Vilmos Papp, modifié il y a 11 années.]

Hi Faramarz,

You should check for your theme's css files for the css classes. Anyway if you try to create a portlet, you could use aui:inputs instead like this:

<aui:form action="<%= configurationURL %>" method="post" name="fm" onsubmit="<%= &quot;event.preventDefault(); &quot; + renderResponse.getNamespace() + &quot;saveConfiguration();&quot; %>">
	<aui:input iputCssClass="aui-field-number" label="shadow-opacity" name="shadowOpacityField" type="text" value="<%= shadowOpacity %>" />
	 <aui:input label="shadow-angle" name="shadowAngleField" type="text" value="<%= shadowAngle %>" />
	<aui:button-row>
		<aui:button type="submit" />
	</aui:button-row>
</aui:form>

<aui:script>
var <portlet:namespace />formValidator;
AUI().ready('aui-form-validator', function(A) {
		<portlet:namespace />formValidator = new A.FormValidator(
				{
					boundingBox: document.<portlet:namespace />fm,
					validateOnInput: true,
					rules : {
						<portlet:namespace />shadowAngleField:{
							digits: true,
							min: 0,
							max: 360
						},
						<portlet:namespace />shadowOpacityField:{
							digits: true,
							min: 0,
							max: 100
						}
					}
				}
			);
	});
</aui:script>

I have this code in one of my hobby portlet's configuration.jsp file and runs fine with 6.1.1 CE GA2

Cheers,
Vilmos

[angu manikandan, modifié il y a 10 années.]

like aui email form validation class instead of i want domain name validation

Example: class="aui-field-required aui-field-email"-->instaed of email i want domain name validation is there any solution regardind my question?????????????????/

[Vilmos Papp, modifié il y a 10 années.]

You can add your regex for domain validation like the rules override.

Take a look at here: http://rajeevalochanabr.wordpress.com/2012/08/20/validation-using-auialloy-user-interface-script-and-html-form/

[Vilmos Papp, modifié il y a 11 années.]

Are you sure, you loaded the aui-form-validator module?

[Faramarz Dorani, modifié il y a 11 années.]

Hi Vilmos Papp, thanks for your help,

Ofcourse I loaded it. Here is the script code:

AUI().ready(
  'aui-form-validator',
  function(A) {
    new A.FormValidator(
      {
        boundingBox: '#myForm'
      }
    );
  }
);