AJAX webform using Prototype library

You can download the source code of this Recaptcha AJAX application by clicking the download link above.Please complete the form below and then press "Submit button".This form will list all validation errors found at once.

AJAX does not only save a lot of CPU intensive activity in the server but at the same time, it helps improving user experience. For example if the user commits a mistake in filling up a form. Then with AJAX; the user will not wait for the whole page to load completely just to know what are those errors. It saves a lot of time in the process and your user will surely love your website.
Enter your Full Name, First name and Last name ONLY (Example: John Doe)

Enter your Phone number (numbers only, no dashes and spaces)

Enter your Age (Numbers only)

This form will validate your data entry using AJAX. If you are correct with your data entry, the entire information entered will be shown below this page without reloading.

Why should you use a Recaptcha based AJAX webform?

1.) Recaptcha solution is one of the most effective captcha solution against bots that will spam your webform by automatically submitting information.

2.) Recaptcha is secure and is not yet effectively cracked. It is now owned by Google.

3.) AJAX solution to web form processing and handling is one of the most important improvements in PHP web development. It is because it saves a lot of server resources at the same time contributing to better user experience.

For more information about AJAX and its use in PHP, you can read this guide: Beginner information about using AJAX calls in PHP

How to validate Recaptcha using AJAX in PHP?

-Using Prototype Javascript library, a developer can pass user-submitted Recaptcha answers to PHP validating script via AJAX using the lines below:

Passing Recaptcha variables to PHP using AJAX

The most important thing you should know is to look closely at the AJAX parameters, you will know that the following Recaptcha variables are passed through AJAX:

a.) Recaptcha_challenge_field
b.) Recaptcha_response_field

Of course your PHP validating script (e.g. ajaxvalidate.php) should be able to received these posted parameters and validate accordingly. One thing that is important is to refresh/reload Recaptcha after the form has been processed. This can done via Javascript using Recaptcha.reload(); function which is executed after PHP provides the response back to the browser (handled by showResponse(req) Javascript function).

Retrieving posted values in AJAX using PHP

This is a screenshot of the sample code:

Retrieving posted values in AJAX

Download source code

Link To This Tool
1. Click inside the codebox
2. Right-Click then Copy
3. Paste the HTML code into your webpage