Jump to content

Ajax Login validation using PHP and jQuery


ben_ford

Recommended Posts

Hi there, I am using the jQuery, Ajax PHP code which is given at http://roshanbh.com.np/2008/04/ajax-login-validation-php-jquery.html

 

The form I am using, which is in index.html, is:

	<form method="post" action="" name="login" id="login_form">
                    <div class="field_row">
                        <div class="label_container">
            				<label>Email</label>                        
                        </div>
                        <div class="field_container">
            				<input type="text" placeholder="login with your email address..." name="email_address" id="email_address" value="" class="large" />                        
                        </div>
        				<div class="clear"><span class="nodisp"> </span></div>							
        			</div>

        			<div class="field_row">
        			    <div class="label_container">
            				<label>Password</label>    			     
        			    </div>
        			    <div class="field_container">
            				<input type="password" placeholder="...and password" name="password" id="password" value="" class="large" />    			     
        			    </div>
        				<div class="clear"><span class="nodisp"> </span></div>						
        			</div>
                
                    <div class="final_row">
                        <input type="image" src="images/login_blue.gif" id="user_login_button" name="user_login_button" value="login" id="submit" class="submit_button" />
                        <div class="final_row_text_container" >
						<a href="/login/forgot_password" style="color: #008ee8;" class="small_text">Forgot your Password?</a>
                        <br />
					<span id="msgbox" style="display:none"></span>
					</div>
                    </div>
				<div class="clear"><span class="nodisp"> </span></div>						

                </form>

 

The Javascript, which is situated in the head of index.html. is:

<script language="javascript">
$(document).ready(function()
{
$("#login_form").submit(function()
{
	//remove all the class add the messagebox classes and start fading
	$("#msgbox").removeClass().addClass('messagebox').text('Validating....').fadeIn(1000);
	//check the email address exists or not from ajax
	$.post("login_ajax.php",{ email_address:$('#email_address').val(),password:$('#password').val(),rand:Math.random() } ,function(data)
        {
	  if(data=='yes') //if correct login detail
	  {
	  	$("#msgbox").fadeTo(200,0.1,function()  //start fading the messagebox
		{ 
		  //add message and change the class of the box and start fading
		  $(this).html('Logging in.....').addClass('messageboxok').fadeTo(900,1,
              function()
		  { 
		  	 //redirect to secure page
			 document.location='secure.php';
		  });
		  
		});
	  }
	  else 
	  {
	  	$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
		{ 
		  //add message and change the class of the box and start fading
		  $(this).html('Your login details are incorrect.').addClass('messageboxerror').fadeTo(900,1);
		});		
          }

        });
		return false; //not to post the  form physically
});
//now call the ajax also focus move from 
$("#password").blur(function()
{
	$("#login_form").trigger('submit');
});
});
</script>

 

And the PHP, in login_ajax.php, is:

<?php session_start();

$host =  "localhost";
$user = "bford";
$pass = "bford";
$db = "bford";

$link = mysql_connect($host, $user, $pass);
	if (!link) 
	{
	die('<strong>Error(s) occured:</strong> Could not connect: ' . mysql_error());
	}

$db_selected = mysql_select_db($db, $link);
	if (!db_selected) 
	{
	die ('<strong>Error(s) occured:</strong> Cant use bford: ' . mysql_error());
	}

//get the posted values
$email_address=$_GET['emailaddress'];
$pass=$_GET['password'];

//now validating the username and password
$sql="SELECT * FROM users WHERE email_address='".$email_address."'";
$result=mysql_query($sql);
$row=mysql_fetch_array($result);

//if username exists
if(mysql_num_rows($result)>0)
{
//compare the password
if($row["password"],$pass)==1
{
	echo "yes";
	//now set the session from here if needed
	$_SESSION["user_name"]=$userID; 
}
else
	echo "no"; 
}
else
echo "no"; //Invalid Login


?>

 

I have been working on this for days now, changing around the form names, database table names, php variables, allsorts! I still cannot get it functioning properly. When I input a correct email_address and password combination, the 'Your login details are incorrect.' message still appears.

 

Help would be much appreciated.

 

Ben.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.