Defafe

In my previous tutorial i have created nice registration form using extjs library, now i want to complate it by adding captcha field.
Captcha is an acronym for “Completely Automated Public Turing test to tell Computers and Humans Apart” (Wikipedia). and made to differentiate between machines (bots) and human.
Captcha often used to ’secure’ form from bot attacks, eg on comment form, contact forms, login form, and registration forms.

I have problem when i try it in hosting server, but when i try it in my localhost, it is fine. below are code to make this tutorial.

If you have solution please post in this blog.

Create javascript file, this file will load register.php and spam.php

Ext.onReady(function(){
	Ext.QuickTips.init();

    var register = new Ext.FormPanel({
		url:'register.php',
		labelWidth : 120,
		anchor:'100%',
		frame:true,
		autoHeight:true,
		bodyStyle:'padding:5px 5px 0',
		defaultType:'textfield',
		items:[
			{
				fieldLabel: 'Full Name',
				name: 'name',
				width:160,
				allowBlank:false
			},
			{
				fieldLabel: 'Username',
				name: 'username',
				width:160,
				maxLength:12,
				minLength:3,
				allowBlank:false
			},
			{
				inputType: 'password',
				fieldLabel: 'Password',
				name:'password',
				width:160,
				allowBlank:false
			},
			{
				inputType: 'password',
				fieldLabel: 'Confirm Password',
				name:'confirm_password',
				width:160,
				allowBlank:false
			},
			{
				vtype:'email',
				allowBlank:false,
				width:160,
				name:'email',
				fieldLabel:'Email'
			},
			{
				fieldLabel: 'Secuity Code',
				name: 'spam',
				width:160,
				allowBlank:false
			},

			{
				xtype:'box',
				autoEl:{
					tag:'img',
					src:'spam.php'
				}
			}

		],

		buttons:[{
                text:'Register',

                handler:function(){
                    register.getForm().submit({
                       method:'POST',
					   waitMsg:'save Data...',
                       success:function(form, action){ 

				            Ext.MessageBox.alert('Succcess','data saved');
							register.getForm().reset();							

                        }, 

                        failure:function(form, action)
						{
                           if(action.failureType == 'server')
						   {
                               obj = Ext.util.JSON.decode(action.response.responseText);
                               Ext.Msg.alert('Login Failed!', obj.errors.reason);
                           }
						else
						{
                           Ext.Msg.alert('Warning!', 'Authentication server is unreachable : ' + action.response.responseText + "abcd");
                            }
                            register.getForm().reset();
                        }
                    });
                }
            }]
    	}); 

		var createwindow = new Ext.Window({
			title:'Form Register',
			width:350,
			autoHeight:true,
			resizable: false,
			buttonAlign:'left',
			closable: false,
			layout: 'fit',
			plain:true,
			items: register
			});

			createwindow.show();

	});

Created register.php file. This file used to check validation captcha and confirm password.

session_start();
$connect = mysql_connect('localhost','root','');
$db = mysql_select_db('register');

	$name = $_POST["name"];
	$username = $_POST["username"];
	$password = $_POST["password"];
	$passwordhash = md5($password);
	$confirmpassword = $_POST["confirm_password"];
	$confirmhash = md5($confirmpassword);
	$email = $_POST["email"];
	$security_code = $_POST['spam'];
	$to_check = md5($security_code);
	if($to_check != $_SESSION['security_code'])
	{
		echo "{success: false, errors: { reason: 'Error Captcha' }}";
	}
	else if ($confirmhash != $passwordhash)
	{

		echo "{success: false, errors: { reason: 'Error Confirm password' }}"; 

	}
	else
	{
		$sql = "INSERT INTO register (`name`,`username`,`password` ,`email`) VALUES ('$name','$username', '$passwordhash', '$email')";
		$query = mysql_query($sql) or die(mysql_error());	

		if($query)
		{

			echo "{success:true}";

		}
		else
		{
			echo "{success: false, errors: { reason: 'errroooooorrrrr' }}";
		}
	}

Create spam.php

session_start();
include_once 'class.captcha.php';

$captcha = new Captcha();

$captcha->chars_number = 5;
$captcha->font_size = 14;
$captcha->tt_font = 'fonts/verdana.ttf';

$captcha->show_image(106, 31);

and here screen shot of register form by using captcha.

captcha-register-form

Download complete source code

http://www.ziddu.com/download/9655440/registerform.zip.html