I have build a login system and I want to pop up a UI Dialog when somebody types a wrong username or a wrong password. I made it pop up when the submit button is clicked, but for some reasons, which I currently don't know, my Dialog box does not open, and I'm automatically redirected to a blank page.
This is my code:
if($count == 1){
$_SESSION['username'] = "username";
$_SESSION['password'] = "password";
header("Location:login_success.php");
}else{
?>
<script src="http://code.jquery.com/jquery-1.11.0.min.js" type="text/javascript" charset="utf-8"></script>
<script src="http://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>
<script>
$("#submit").click(function(){
$("#popup").dialog({
autoOpen: false,
modal: true,
height: 300,
width: 300,
title: "Error",
buttons: {
'OK': function(){
$(this).dialog("close");
}
}
});
});
$('#submit').click();
</script>
<?php
}
?>
Full HTML Form
<!DOCTYPE html>
<html>
<head>
<title>Sign In</title>
<link rel="stylesheet" href="css/SignIn.css" type="text/css" media="screen" title="no title" charset="utf-8">
</head>
<body>
<form action="includes/check_login.php" method="post">
<p>
<label for="username">Username</label>
<input id="username" name="username" type="text">
<span>Username cannot be empty</span>
</p>
<p>
<label for="password">Password</label>
<input id="password" name="password" type="password">
<span>Password cannot be empty</span>
</p>
<p>
<input type="submit" value="LOG IN" id="submit">
</p>
<p id="account">
No account ? Please <a href="signUp.html">Sign Up!</a><br><br>
<a href="ForgotPassword.html">Forgot password ?</a>
</p>
</form>
<div id="popup" style="display: none">
<p>Wrong username or password</p>
</div>
<script src="http://code.jquery.com/jquery-1.11.0.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/SignIn.js" type="text/javascript" charset="utf-8"></script>
</body>
</html>
