Jump to content

Display Msg In Div Tag Without Refreshing The Page Php Mysql Jquery Ajax

prash91

By prash91
in Javascript Help

Recommended Posts

prash91 Newbie

prash91

Posted
Posted

Hi got following code but dont know why it is not working

 

database: login

table name : register1

3 fields: username, password, email

 

filename : login.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>PHP Login with jQuery AJAX</title>

<link rel="stylesheet" type="text/css" href="css/style.css" />

<script type="text/javascript" src="js/jquery.latest.min.js"></script>

<script type="text/javascript">

$(document).ready(function() {

 

$("#login").click(function() {

 

var action = $("#form1").attr('action');

var form_data = {

username: $("#username").val(),

password: $("#password").val(),

is_ajax: 1

};

 

$.ajax({

type: "POST",

url: action,

data: form_data,

success: function(response)

{

if(response == 'success')

$("#form1").slideUp('slow', function() {

$("#message").html("<p class='success'>You have logged in successfully!</p>");

});

else

$("#message").html("<p class='error'>Invalid username and/or password.</p>");

}

});

 

return false;

});

 

});

</script>

</head>

<body>

<p> </p>

<div id="content">

<h1>Login Form</h1>

<form id="form1" name="form1" action="loginpost.php" method="post">

<p>

<label for="username">Username: </label>

<input type="text" name="username" id="username" />

</p>

<p>

<label for="password">Password: </label>

<input type="password" name="password" id="password" />

</p>

<p>

<input type="submit" id="login" name="login" />

</p>

</form>

<div id="message"></div>

</div>

</body>

</html>

 

filename : loginpost

 

<?php

 

$is_ajax = $_REQUEST['is_ajax'];

if(isset($is_ajax) && $is_ajax)

{

require("conn1db.php");

$username = $_REQUEST['username'];

$password = $_REQUEST['password'];

 

$sql=mysql_query("select * from register1 where username='$username' AND password='$password'");

if(mysql_num_rows($sql)>0)

{

// Register $myusername, $mypassword and redirect to file “login_success.php”

session_start();

$_SESSION['username'] = $_POST['username'];

echo “success”;

}

 

}

 

?>

 

file name : style.css

 

body, input {

font-family: Georgia, "Times New Roman", Times, serif;

}

#content {

background-color: #eee;

width: 300px;

margin: 0 auto;

border: 1px solid #aaa;

-moz-border-radius: 10px;

-moz-box-shadow: 0 0 10px #aaa;

-webkit-border-radius: 10px;

-webkit-box-shadow: 0 0 10px #aaa;

padding: 10px;

}

#form1 label {

display: block;

font-size: 16px;

line-height: 25px;

}

#form1 input[type=text], #form1 input[type=password] {

padding: 2px;

font-size: 16px;

line-height: 20px;

width: 250px;

}

#form1 input[type=submit] {

font-size: 20px;

font-weight: bold;

padding: 5px;

}

.success {

color: #060;

}

.error {

color: red;

}

Pikachu2000 Prolific Member

Pikachu2000

Posted
Posted

The forum you posted in is for questions related to this site. Moving to proper forum.

 

Also, when posting code, enclose it within the forum's 

 . . .

BBCode tags.

Christian F. Member

Christian F.

Posted
Posted

Please use the [code][/code] tags around your code, as it helps make both your post and your code a lot easier to read. Also, you have to define what "not working" means, preferably with (complete) error messages. We don't know what you're trying, what you're expecting, or anything but what you explicitly tell us.

 

PS: I also recommend that you read this article.

prash91 Newbie

prash91

Posted
  • Author
Posted

Hi have following details of my code, I am making user login, if user click on submit button and if the user is valid the form will side with msg "You have logged in successfully " else it will display msg "incorrect username or password" , the msg will get display in DIV message tag and without reloading the page.so i am using ajax with support of jquery...

 


  •  

 

Posted Today, 07:36 PM

Hi got following code but dont know why it is not working

 

database: login

table name : register1

3 fields: username, password, email

 

filename : login.php

 

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[url="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"][color="#0f72da"]http://www.w3.org/TR...ransitional.dtd[/color][/url]">
< html xmlns="[url="http://www.w3.org/1999/xhtml"][color="#0f72da"]http://www.w3.org/1999/xhtml[/color][/url]">
< head>
< meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
< title>PHP Login with jQuery AJAX</title>
< link rel="stylesheet" type="text/css" href="css/style.css" />
< script type="text/javascript" src="js/jquery.latest.min.js"></script>
< script type="text/javascript">
$(document).ready(function() {

$("#login").click(function() {

var action = $("#form1").attr('action');
var form_data = {
username: $("#username").val(),
password: $("#password").val(),
is_ajax: 1
};

$.ajax({
type: "POST",
url: action,
data: form_data,
success: function(response)
{
if(response == 'success')
$("#form1").slideUp('slow', function() {
$("#message").html("<p class='success'>You have logged in successfully!</p>");
});
else
$("#message").html("<p class='error'>Invalid username and/or password.</p>");
}
});

return false;
});

});
< /script>
< /head>
< body>
< p> </p>
< div id="content">
<h1>Login Form</h1>
<form id="form1" name="form1" action="loginpost.php" method="post">
<p>
<label for="username">Username: </label>
<input type="text" name="username" id="username" />
</p>
<p>
<label for="password">Password: </label>
<input type="password" name="password" id="password" />
</p>
<p>
<input type="submit" id="login" name="login" />
</p>
</form>
<div id="message"></div>
< /div>
< /body>
< /html>

 

 

filename : loginpost

< ?php

$is_ajax = $_REQUEST['is_ajax'];
if(isset($is_ajax) && $is_ajax)
{
require("conn1db.php");
$username = $_REQUEST['username'];
$password = $_REQUEST['password'];

$sql=mysql_query("select * from register1 where username='$username' AND password='$password'");
if(mysql_num_rows($sql)>0)
{
// Register $myusername, $mypassword and redirect to file “login_success.php”
session_start();
$_SESSION['username'] = $_POST['username'];
echo “success”;
}

}

?>[
/code]


file name : style.css
[code]
body, input {
font-family: Georgia, "Times New Roman", Times, serif;
}
#content {
background-color: #eee;
width: 300px;
margin: 0 auto;
border: 1px solid #aaa;
-moz-border-radius: 10px;
-moz-box-shadow: 0 0 10px #aaa;
-webkit-border-radius: 10px;
-webkit-box-shadow: 0 0 10px #aaa;
padding: 10px;
}
#form1 label {
display: block;
font-size: 16px;
line-height: 25px;
}
#form1 input[type=text], #form1 input[type=password] {
padding: 2px;
font-size: 16px;
line-height: 20px;
width: 250px;
}
#form1 input[type=submit] {
font-size: 20px;
font-weight: bold;
padding: 5px;
}
.success {
color: #060;
}
.error {
color: red;
}

Archived

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

Go to topic listing
×
×
  • 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.