validation – Tutorius

Some quick references here to data validation resources.Â Many or most of these resources will refer to the Validate plugin for jQuery.

Server Side

http://phpmaster.com/form-validation-with-php/

Client Side

Much of client side dataÂ validation will center around jQuery.

Tutorials:

jQuery Tutorials
Tutorials on jQuery.com
Form Validation using jQuery (Includes coding a method to validate a drop-down list.)

Custom Rules

Â jQuery Validate Plugin: Creating Custom RulesÂ
Random Acts of Coding: How to write custom validation rulesÂ Includes list of built-in validation rules.
Unique Username Validation Rule

Conditional Validation

Conditional validation of a group.

A group of controls appears or disappears based on the state of another control.
Also formats/masks the phone number field

Notes

To test if jQuery library is loaded, place the following in the HEAD of your document:

<script type="text/javascript">// <![CDATA[
  $().ready(function() {
    alert("HELLO");
  });
// ]]></script>

Placing an invisible validation link on a page

The HTML validator at http://validator.w3.org is a tremendous resource for web developers, helping us to ensure that our pages validate to the W3C standard.

Creating a Validation Link

Many developers place a link to the validator in the header or footer of their site so that they can demonstrate that their site is compliant.

1	<a href="http:///validator.w3.org/check/referer">Valid XHTML</a>

(The /check/referrer string tells the validator to validate what ever page the visitor came from)

Creating an Invisible Validation Link

Sometimes however, I like the link to be invisible, which I do be creating a link to a single non-breaking space entity. I use CSS to ensure that there is no underline and that the link doesn't stand out against a coloured background when the link is hovered over. Of course this means you have to know that there is an invisible hotspot at a certain point on the page. I often put it right after the text in my footer, as users don't often hover the mouse there. (All of this should be on on one line, I've put hard returns here only to keep it from scrolling out of the box.)

1 2	<a href="http:///validator.w3.org/check/referer" style="border-bottom: 0px;background-color:inherit;"> </a>

Now there's an invisible validation link that I can have on my site throughout development for fast, easy validation checks. When the site goes live I can decide whether to leave it in or not.