Adding Ajax

Live Validation

There's nothing that irritates me more than signing up for an account on a site that asks for a username and then responds with, "That username has been taken. Please choose another," usually with some lame variation of the username as a suggestion. The process is made worse when you have to submit a form and have it rejected because of the username or some other value that doesn't validate. If the application is decent, it will have preserved the data, but still, it adds to the overall awkwardness of the sign-up process, and if it's annoying enough, I won't even finish.

This is another area where Ajax can be added unobtrusively. It can provide live validation of entered data as soon as the user tabs away from the field or clicks a button to submit the form, but before the form is actually submitted. It's not the same as typical client-side validation, which would check to ensure that a field was filled in or that the email address entered in a field had proper syntax. No, it uses Ajax to validate a value against a database, returning whatever error is provided by the service, all within the same page.

Tip

I say unobtrusive because if scripting is disabled, the errors will be found when the page goes through the regular form submission. The scripting is an enhancement, not a requirement.

In WordPress, a user can register for an account if the WordPress weblog owner allows it. When a user registers, he provides a preferred username and email address, and a password is ...