I'm so confused, I can't even explain my problem very well. When I click on my sign up button, it redirects to index.php
. It's supposed to check for errors, not redirect or anything like that. I've tried deleting bugs from my code, changing id's, changing css properties. Adding and deleting JQuery. I really have no idea how to fix this problem.
EDIT
In the success function, I have tried to remove window.open()
and it still redirects to index.php
on click of #check_signup
. I'm going to keep that line there to show what the original code is suppose to look like. The code isn't suppose to be redirecting because the code hasn't reached the success text yet.
What's suppose to happen is that the code checks for errors through AJAX through check_signup.php. This page then returns the word "success" if the code all executed properly. The code in script.js then check for the word "success" before redirecting to index.php.
I tried removing the id #check_signup
and the page didn't redirect. When I try to make the page alert on click of #check_signup
, it doesn't work. So the page is redirecting before the click element is registered.
This is the code:
script.js
$(document).ready(function() {
/* Sign Up Page */
$("#check_signup").click(function() {
var username_signup = $("#signup_container input[key='username_signup']").val();
var email_signup = $("#signup_container input[key='email_signup']").val();
var password_signup = $("#signup_container input[key='password_signup']").val();
$.ajax({
type: "POST",
url: "check_signup.php",
data: {username: username_signup, email: email_signup, password: password_signup},
success: function(data){
if(data.indexOf("Success")) {
window.open("index.php","_self");
} else {
$("#signup_container").html(data);
}
}
});
});
});
signup.php
<?php
require "connect.php";
?>
<!DOCTYPE html>
<html>
<head>
<title> Website </title>
<!-- CSS Files -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="css/styles.css">
<!-- JS Files -->
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src='js/jquery.countdown.js'></script>
<script src='js/script.js'></script>
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-brand">
<a href="index.php"> <img src="http://logos-download.com/wp-content/uploads/2016/06/Udemy_logo.png" class="img-responsive" id="logo"> </a>
</div>
<div class="pull-right">
<a href='login.php'> <button type="button" class="btn btn-danger" id="login_button">Login</button> </a>
</div>
</div>
</nav>
<!-- End of Navigation col-md-3 portfolio-item -->
<div class="container">
<div class="row vertical-offset-100">
<div class="col-md-4 col-md-offset-4" id='login_form'>
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Join for Free</h3>
</div>
<div class="panel-body" id='signup_container'>
<form>
<fieldset>
<div class="form-group">
<input class="form-control" placeholder="Username" name="username" type="text" key='username_signup' autocomplete="off">
</div>
<div class="form-group">
<input class="form-control" placeholder="Email" name="email" type="text" key='email_signup' autocomplete="off">
</div>
<div class="form-group">
<input class="form-control" placeholder="Password" name="password" type="password" value="" key='password_signup' autocomplete="off">
</div>
<input class="btn btn-lg btn-primary btn-block" type="button" value="Sign Up Now" id='check_signup'>
</fieldset>
</form>
</div>
</div>
</div>
</div>
</div>
<!-- End of Login Page -->
check_signup.php
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src='js/script.js'></script>
<?php
require "connect.php";
error_reporting(0);
// Variables
$username = $_POST["username"];
$email = $_POST["email"];
$password = $_POST["password"];
$md5_password = md5($password);
// Username
echo " <form>
<fieldset>";
if(strlen($username) < 3) {
echo "<div class='form-group has-error'>
<label class='control-label' for='inputError1'>Username requires 3 characters</label>
<input type='text' class='form-control' id='inputError1' key='username_signup' value='$username'>
</div>";
} else {
$username_count++;
}
if(strlen($username) > 25) {
echo "<div class='form-group has-error'>
<label class='control-label' for='inputError1'>The username is limited to 25 characters</label>
<input type='text' class='form-control' id='inputError1' value='$username' key='username_signup'>
</div>";
} else {
$username_count++;
}
$check_user = $db->query("SELECT * FROM users WHERE username='$username'");
$num_user = $check_user->num_rows;
if($num_user == 0) {
$username_count++;
} else {
echo "<div class='form-group has-error'>
<label class='control-label' for='inputError1'>Username Taken </label>
<input type='text' class='form-control' id='inputError1' value='$username' key='username_signup'>
</div>";
}
if($username_count == 3) {
echo "<div class='form-group'>
<input class='form-control' placeholder='Username' name='username' type='text' id='username_signup' value='$username' key='username_signup'>
</div>";
}
// End of Username
// Email
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
// invalid emailaddress
echo "<div class='form-group has-error'>
<label class='control-label' for='inputError1'>Invalid Email</label>
<input type='text' class='form-control' id='inputError1' value='$email' key='email_signup'>
</div>";
} else {
$email_count++;
}
$check_email = $db->query("SELECT * FROM users WHERE email='$email'");
$num_email = $check_email->num_rows;
if($num_email == 0) {
$email_count++;
} else {
echo "<div class='form-group has-error'>
<label class='control-label' for='inputError1'>Email Taken</label>
<input type='text' class='form-control' id='inputError1' value='$email' key='email_signup'>
</div>";
}
if($email_count == 2) {
echo "<div class='form-group'>
<input class='form-control' placeholder='Username' name='username' type='text' id='username_signup' value='$email' key='email_signup'>
</div>";
}
// End of Email
// Password
if(strlen($password) < 6) {
echo "<div class='form-group has-error'>
<label class='control-label' for='inputError1'>Password requires 6 characters</label>
<input type='password' class='form-control' id='inputError1' value='$password' key='password_signup'>
</div>";
} else {
$password_count++;
echo "<div class='form-group'>
<input class='form-control' placeholder='Password' name='password' type='password' id='password_signup' value='$password' key='password_signup'>
</div>";
}
echo "<input class='btn btn-lg btn-primary btn-block' type='button' value='Sign Up Now' id='check_signup'>
</fieldset>
</form>";
// End of Password
if($username_count == 3 && $email_count == 2 && $password_count == 1) {
$db->query("INSERT INTO users VALUES('','$username','$email','$md5_password')");
$findID = $db->query("SELECT * FROM users WHERE username='$username' AND password='$md5_password'");
$fetchID = $findID->fetch_object();
$real_id = $fetchID->id;
session_start();
$_SESSION["username"] = $real_id;
echo "Success";
}
?>
I know this is a lot of code. I have literally tried everything I can think of. I'm sure it's a simple bug, but I don't know how to fix this code. I'm trying to fix the code to check for errors and not to redirect back to index.php.