I have html:
<body>
<div class="po-logo">
<img src="img/logos/lw.png" alt="logo watchbees"/>
</div>
<form>
<div class="mui-textfield mui-textfield--float-label reg-window">
<input id="username" name="username" type="text"/>
<label>Username</label>
</div>
<div class="mui-textfield mui-textfield--float-label reg-window">
<input id="password" name="password" type="password"/>
<label>Password</label>
</div>
<div class="mui-textfield mui-textfield--float-label reg-window">
<button id="login" value="submit" onclick="return result" class="mui-btn mui-btn--raised reg-win-button">Sign in</button>
</div>
</form>
Jquery in html:
$("#login").click(function(){
var username=$("#username").val();
var password=$("#password").val();
if(($.trim(username).length > 0) & ($.trim(password).length > 0))
{
$.ajax({
type: "POST",
url: "http://127.0.0.1/app/login.php",
data: {username: username, password: password},
beforeSend: function(){ $("#login").html('Prihlasovanie...');},
success: function(data){
if(data == "success")
{
localStorage.login="true";
localStorage.username=username;
window.location.href = "profil.html";
}
else if (data = "failed")
{
alert("Problem s prihlasením, skúste znovu.");
$("#login").html('Prihlásiť sa');
}
}
});
}return false;
});
And php file on localserver, login.php:
if (isset($_POST['username'], $_POST['password'])){
$username=mysql_real_escape_string(htmlspecialchars(trim($_POST['username'])));
$password=mysql_real_escape_string(htmlspecialchars(trim($_POST['password'])));
$login = mysql_num_rows(mysql_query("SELECT * FROM `login` WHERE `username`='$username' AND `password`='$password'"));
if($login != 0){
echo "success";
}
else{
echo "failed";
}
}
But something is wrong, ajax doesn't send my back any data. It only changes #login to "connecting..." but nothing happens. Inscribing information is correct and they are uploaded to the database. Most likely php doesn't send back any data or ajax in html doesn't correct processing data from php. I don't where is problem. Profil.html is in the same folder as index.html. But login.php is on local server.
HTML: index.html; PHP: login.php on local server on my latop; Server: 127.0.0.1, database name db_login.
Any help or pointers greatly appreciated.
First - you have to check is ajax request pointed correctly to your php file. Open inspector in Chrome, switch to tan network then Emanuel filter xhr. After click on #login you should see new request there. Click on it, switch to response tab and paste its content here Please
Your issue is below lines:
in JS:
data: {username: username, password: password},
in PHP:
if(isset($_POST['login'])){
Reason
From JS side, you are passing 2 params in the POST request: username and password, while in PHP, you are checking for $_POST['login']. You should instead be checking for $_POST['username'] and $_POST['password'] in PHP.
Also, you are using mysql_real_escape_string() which is deprecated since PHP 5.5. And, you are injecting the username and password, which are both user inputs, directly into the mysql query leading to serious security issues relating to SQL Injection. Use PHP-MySQLi or PDO API and prepared statements.
OK, but why first If takes true ? Author, Please give us request headers of that xhr from inspector