Return value from ajax form
Question
I have a login form in php. I have used ajaxform so that the page does not get reloaded when the username or password is wrong. I have another page checklogin.php which checks whether the username and pw is there in the database and it returns the count of the number of rows. I want to compare the count in the login.php and display the error message if the count=1 and redirect to another page if count=2. I tried to display the count in an errordiv using target: 'errordiv' and checking its innerHTML but it failed to do so.
My login.php
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script type="text/javascript" src="scripts/jquery.form.js"></script>
<!--Slider-in icons-->
<script type="text/javascript">
function checklogin()
{
var request=$("#login-form").ajaxForm(
{
target:'#errordiv'
}).abort();
request.submit();
var divmsg=document.getElementById("errordiv");
if (divmsg.childNodes[0].nodeValue == "1")
{
divmsg.childNodesp[0].nodeValue="Sorry";
alert ("Invalid username or password");} //I didn't get the alert as well a the divmsg content didn't change
};
</script>
</head>
<body>
<!--WRAPPER-->
<div id="wrapper">
<!--LOGIN FORM-->
<form name="login-form" id="login-form" class="login-form" action="checklogin.php" method="post">
<!--CONTENT-->
<div class="content">
<!--USERNAME--><input name="un" type="text" class="input username" placeholder="Username" onfocus="this.value=''" required="required" /><!--END USERNAME-->
<!--PASSWORD--><input name="pw" type="password" class="input password" placeholder="Password" onfocus="this.value=''" required="required" /><!--END PASSWORD-->
</div>
<!--END CONTENT-->
<!--FOOTER-->
<div class="footer">
<!--LOGIN BUTTON--><input type="submit" name="submit" value="Login" class="button" onclick="checklogin()" /><!--END LOGIN BUTTON-->
</div>
<!--END FOOTER-->
</form>
<div id="errordiv" class="errordiv"></div>
<!--END LOGIN FORM-->
checklogin.php
<?php
include ('dbconn.php');
$user = trim($_POST['un']);
$pass = trim($_POST['pw']);
$user = mysql_real_escape_string($user);
$pass = mysql_real_escape_string($pass);
$result=mysql_query("select Id from login where Username='$user' and Password='$pass'") or die (mysql_error());
$result= mysql_fetch_assoc($result);
$num= count ($result);
echo $num;
?>
How can I get the value of $num in login.php without displaying it to a div and compare the value of $num and accordingly display the errormsg in errordiv or if $num==2 redirect to another page.
2 answers
solution1
1 2013-07-11 02:47:35
Change your code to include the code which change the div and provide alert to be included in the callback.
var request=$("#login-form").ajaxForm(
{
target:'#errordiv',
success: function (html) {
if ($("#errordiv).html() == "1") {
$("#errordiv).html("Sorry");
alert ("Invalid username or password");
}
}
}).abort();
request.submit();
solution2
0 2013-07-11 02:56:15
Maybe try to make the checking request asynchronously and process user feedback in AJAX callback:
JS:
$(function(){
$("#login-form").ajaxForm(function(response){
if(response.count===1){
$("#errordiv").html("msg you want to show");
}else if(response.count===2){
//redirect
}
});
});
php:
<?php
header("Content-Type: application/json");
//your database check logic
$user = trim($_POST['un']);
$pass = trim($_POST['pw']);
$user = mysql_real_escape_string($user);
$pass = mysql_real_escape_string($pass);
$result=mysql_query("select Id from login where Username='$user' and Password='$pass'") or die (mysql_error());
$result= mysql_fetch_assoc($result);
$num= count ($result);
//and return response in JSON
echo json_encode(array("count"=>$num));
?>
Hope this is helpful for you.
[EDIT]
remove the form submit button inline JS function invoking:
onclick="checklogin()"
and put checklogin function logic to document ready callback, initialize the form when the DOM is ready
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.