Form Real Time Data Checks Using AJAX

KeyWords: ajax, programming, javascript, password, code, php, technology, xml, submit, form, check, data, logic

Form Real Time Data Checks Using AJAX
by FrosT

Filling out forms has always been a pain in the butt throughout the history of the internet. I always hated filling out a form to figure out when I hit the "submit" button I had an error and whoops! The form was erased. Than you beat your computer for 5 minutes and than go back to filling out the form hopefully right this time. Well I ask you this, why do a Postback to check data when you can check it as the user fills out the form.

In this article I will be describing ways to use AJAX for error checking purposes and putting this technology of Javascript and XML to good use.

What Needs to be Checked?
Before we go anywhere we need to ask ourselves, what form fields need to be checked? We may want to check all fields, including optional, or we may want to just check the required and do nothing with the optional fields. First you need to figure out what needs to be checked before being entered into a DB. For example, a date field would probably need to be checked for correct formatting and making sure it is a valid date.

Password Form Checking Logic
Alright here is an example, in words, on how to setup a data check using AJAX on a Password input box. First we need all the AJAX code, too bad I will not provide any. Do research. I will provide logic, you must do the code. Sorry folks. After that there are many different ways to setup the check. If JavaScript is powerful enough for you to verify a password than hey that works, simply use the onkeypress event to check it every step of the way. If that will not due for many reasons here is how AJAX would help you out.

Create the form with the password fields. Next apply the AJAX connect code. Now create a file and call it something like ajax_passwordchk.php. Inside this file will be your logic for checking a password. Now on the input box's for the password field do an onBlur. When they leave the text field the onBlur event will call up the javascript ajax and send the field data to the PHP file. The PHP file will do the checks you define and return a string, a value or something that you can than use to either alert the user that their password is too weak, or does not match the check password field and than send them back to the password box.

Using this logic you can create a pretty cool little check. If you wanted to you could do the onkeypress that updates a label to the side of the password box that tells the user in real-time if the password is too weak, ok, strong, or very strong. If you really go out of your way you can even make suggestions right there given the password they entered. For instance if they used "toilet" you could suggest "t0!l3T" to beef up the password.

Ending Notes
There is the logic that can be used to create a real-time password check on a form using AJAX and PHP. I am sorry no code is provided, there are reasons I will not provide code on blogs, the main reason is my blog is not for showing off code that is what a website is for. Sorry folks, no free code from this blog. If you would like custom code feel free to contact me for a price at frost [-at-] aeonity [-dot-] com.

Posted by frost on Aug 31st, 2006 09:51 - Subscribe Bookmark and Share

Post a comment:


Posting as anonymous Anonymous guest, why not register, or login now.

Posted by anonymous on October 14th, 2006


Posted by anonymous on February 26th, 2009

thank for thi




  • Not Implemented