I have this simple login form with Jquery, ajax & PHP when the login is successful the home page is showing in div section instead of going to a next webpage. Any suggestions?
HTML Form:
<script>
$(document).ready(function(){
$('form').submit(function(){
var userid = $('#userid').val();
var password = $('#password').val();
if (userid == '' || password == '') {
$("#msg").html("All Fields Required");
return false;
}
$.ajax({
data: {"userid":userid, "password":password},
type: $(this).attr('method'),
url: $(this).attr('action'),
success: function(data){
$("#msg").html(data);
}});
return false;
});
});
</script>
<form method="post" class="form-horizontal" action="login.php">
<input id="userid" name="userid" type="text" class="form-control" placeholder="User ID">
<input id="password" name="password" type="password" class="form-control" placeholder="Password">
<button type="submit" name="submit" id="submit" class="btn btn-primary"><b>Login</b></button>
<h4 align="center" id="msg" style="background-color: red; color: white;"></h4>
</form>
PHP code:
<?php
include 'db.php';
$user = $_POST['userid'];
$pass = $_POST['password'];
$query = mysqli_query($con, "SELECT * FROM login WHERE userid='$user' AND password='$pass'") or die (mysqli_error($con));
$result = mysqli_num_rows($query);
while($row = mysqli_fetch_array($query)){
$_SESSION['user'] = $row['userid'];
}
if(!$result){
echo "Username or Password is incorrect!";
}else{
header("Location: claims.php?id='".$_SESSION['id']."'");
}
mysqli_close($con);
?>