Apply for Zend Framework Certification Training

Jquery





First Step   index.php

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> Webphplearn Ajax Login</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script src="jquery.js" type="text/javascript" language="javascript"></script>
<link rel="stylesheet" href="style.css">
<script language="javascript">

$(document).ready(function()
{
	$("#login_form").submit(function(){
		$("#msgbox").addClass('messagebox').text('Validating....').fadeIn(1000);
		$.post(
			"ajax_login.php",
			{ user_name:$('#username').val(),password:$('#password').val()} ,
			function(data){
		  		if(data=='yes'){
			  		$("#msgbox").fadeTo(200,0.1,function(){ 
				  	$(this).html('Logging in.....')
				  		.addClass('messageboxok')
				  		.fadeTo(900,1,function(){document.location='secure.php';});
			  
					});
			  	}else{
			  		if(data=='user_name'){
	  		
			  		$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
					{ 
				 	  $(this).html('Enter User Name').addClass('messageboxerror').fadeTo(900,1);
					});	
					}else if(data=='pass'){
	  		
			  		$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
					{ 
				 	  $(this).html('Enter your password').addClass('messageboxerror').fadeTo(900,1);
					});	
					}else{
					$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
					{ 
				 	  $(this).html('Enter Correct Credential').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>
</head>
<body>

 
<br>
<br>
<?php session_start(); session_destroy();?>
<form method="post" action="" id="login_form">
<div align="center">
<div>User Name : <input name="username" type="text" id="username" /></div>
<div style="margin-top:5px" >Password :   <input name="password" type="password" id="password" /></div>
<div class="buttondiv">
    <input name="Submit" type="submit" id="submit" value="Login" style="margin-left:-10px; height:23px"  />
     <span id="msgbox" style="display:none"></span>
</div>
</div>
</form>
</body>
</html>


Step 2    ajax_login.php

<?php 
session_start();
$link = mysql_connect('localhost', 'root', ''); 
if (!$link) {
    die('Could not connect: ' . mysql_error());
}
mysql_select_db('company'); 
$user_name=htmlspecialchars($_POST['user_name'],ENT_QUOTES);
$pass=$_POST['password'];
$sql="SELECT user_name, password FROM tbl_user WHERE user_name='".$user_name."'";
$result=mysql_query($sql);
$row=mysql_fetch_array($result);
if($user_name==""){
	echo "user_name";
}else if($pass ==""){
	echo "pass";
}else if(mysql_num_rows($result)>0){
	if(strcmp($row['password'],$pass)==0){
		echo "yes";
		$_SESSION['u_name']=$user_name; 
	}else{
		echo "no"; 
	}
}else{
	echo "no"; 
}

?>

step 3  secure.php

<?php session_start();

if(empty($_SESSION['u_name']))
	header("Location:index.php");	


if(isset($_GET['logout']))
{
	session_destroy();
	header("Location:index.php");
}	

echo "<a href='secure.php?logout'><b>Logout<b></a>";
echo "<div align='center'>You Are inside secured Page</a>";

?>

< How to select option attribute value using jquery Dropdown with search in jquery >



Ask a question



  • Question:
    {{questionlistdata.blog_question_description}}
    • Answer:
      {{answer.blog_answer_description  }}
    Replay to Question


Back to Top