Client-side data validation is win-win: it helps you by keeping the data clean and helps the user by giving immediate, targeted feedback.
We need some data cleaning, so let's start with the fields on the Personal Data tab. First start with a regular <input> or <textarea> tag.
Add a dojoType= arrtibute of dijit.form.ValidationTextBox. Then add validations and filed-cleansing attributes:
<label for="first_name">First Name:</label>
<input type="text" name="first_name" id="first_name" dojoType="dijit.form.ValidationTextBox" trim="true"
propercase="true" required="true" size="30" missingMessage="You must enter your first name" /><br/>
And don't forget to add dojo.require to the header:
These extra attributes do an incredible amount of work:
- required="true" makes the field required, of course. When the field is blank, the background is colored yellow, as is the case with any erroneous fields.
- trim="true" automatically removes leading and trailing spaces in the input.
- Propercase="true" is similiar to trim. When the box loses focus, the first Letter is capitalized, and the rest are lowercased.