Menu
Okay so I am having issues with my script, not sure what the issue is, everything in my eyes seems to check up. but hopefully you guys can tell what the issue is (I haven't made the PHP script submit the registration to the database, but the script never returns)
So the issue is basically, after clicking the register button it does absolutely nothing, no error logs, nothing shows up.
Here's the Register.php file located at c:/website/@account/register.php
<?php
include("@includes/database.php");
include("@includes/init.php");
$x1 = rand(2,15);
$x2 = rand(1,14);
//Get Captcha Answer
$first = $x1;
$second = $x2;
$answer = $first + $second;
if ($user -> LoggedIn())
{
header('Location: index.php?page=Dashboard');
}
?>
<!DOCTYPE html>
<html class="no-js">
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Business Name | Registration</title>
<link href="https://fonts.googleapis.com/css?family=Roboto:400,300,100,500,700,900" rel="stylesheet" type="text/css">
<link href="@assets/css/icons/icomoon/styles.css" rel="stylesheet" type="text/css">
<link href="@assets/css/bootstrap.css" rel="stylesheet" type="text/css">
<link href="@assets/css/core.css" rel="stylesheet" type="text/css">
<link href="@assets/css/components.css" rel="stylesheet" type="text/css">
<link href="@assets/css/colors.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="@assets/js/plugins/loaders/pace.min.js"></script>
<script type="text/javascript" src="@assets/js/core/libraries/jquery.min.js"></script>
<script type="text/javascript" src="@assets/js/core/libraries/bootstrap.min.js"></script>
<script type="text/javascript" src="@assets/js/plugins/loaders/blockui.min.js"></script>
<script type="text/javascript" src="@assets/js/plugins/forms/styling/uniform.min.js"></script>
<script type="text/javascript" src="@assets/js/core/app.js"></script>
<script type="text/javascript" src="@assets/js/pages/login.js"></script>
<script>
function register()
{
var username=$('#username').val();
var password=$('#password').val();
var rpassword=$('#rpassword').val();
var email=$('#email').val();
var captcharesult=$('#captcharesult').val();
var answer="<?php echo $answer; ?>";
document.getElementById("registerdiv").style.display="none";
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("registerdiv").innerHTML=xmlhttp.responseText;
document.getElementById("registerdiv").style.display="inline";
if (xmlhttp.responseText.search("Redirecting") != -1)
{
setInterval(function(){window.location="google.com"},3000);
}
}
}
xmlhttp.open("POST","login.php?type=register",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("username=" + username + "&password=" + password + "&repeatpassword=" + repeatpassword + "&email=" + email + "&captcharesult=" + captcharesult + "&answer=" + answer);
}
</script>
</head>
<body>
<div class="page-container login-container">
<div class="page-content">
<div class="content-wrapper">
<div class="content">
<!-- Advanced login -->
<form method="post" action="" name="register">
<div class="panel panel-body login-form">
<div class="text-center">
<h5 class="content-group">Business Name <small class="display-block">Account Registration</small></h5>
<div id="registerdiv" style="display:inline"></div>
</div>
<div class="form-group has-feedback has-feedback-left">
<input type="text" class="form-control" name="username" id="username" placeholder="Username">
<div class="form-control-feedback">
<i class="icon-user-check text-muted"></i>
</div>
</div>
<div class="form-group has-feedback has-feedback-left">
<input type="text" class="form-control" name="email" id="email" placeholder="Email Address">
<div class="form-control-feedback">
<i class="icon-mail5 text-muted"></i>
</div>
</div>
<div class="form-group has-feedback has-feedback-left">
<input type="password" class="form-control" name="password" id="password" placeholder="Password">
<div class="form-control-feedback">
<i class="icon-lock2 text-muted"></i>
</div>
</div>
<div class="form-group has-feedback has-feedback-left">
<input type="password" class="form-control" name="repeatpassword" id="repeatpassword" placeholder="Repeat Password">
<div class="form-control-feedback">
<i class="icon-lock2 text-muted"></i>
</div>
</div>
<div class="form-group has-feedback has-feedback-left">
<input type="text" class="form-control" name="captcharesult" id="captcharesult" placeholder="<?php echo ''.$x1.'+'.$x2.'?'; ?>">
<div class="form-control-feedback">
<i class="icon-info3 text-muted"></i>
</div>
</div>
<input name="one" type="hidden" value="<?php echo $x1; ?>" />
<input name="two" type="hidden" value="<?php echo $x2; ?>" />
<button type="button" onclick="register()"class="btn bg-primary btn-block btn-lg">Register</button>
<button name="login" id="login" type="submit" class="btn bg-success btn-block btn-lg">Login</button>
</div>
</form>
<center>
<div class="text-muted">
© 2015-<?php echo date('Y'); ?> <a href="https://Business Name.com/">Business Name</a>
</div>
</center>
</div>
</div>
</div>
</div>
</body>
</html>
Here's the login.php located at c:/website/login.php
<?php
include("@includes/database.php");
include("@includes/init.php");
if ($type == 'register')
{
//Get Registration Info
$username = $_POST['username'];
$email = $_POST['email'];
$password = $_POST['password'];
$repeatpassword = $_POST['repeatpassword'];
$captcharesult = $_POST['captcharesult'];
//Errors
$errors = 0;
//Check If Everything Is Filled
if (empty($username) || empty($email) || empty($password) || empty($repeatpassword) || empty($captcharesult))
{
echo '<div class="alert bg-danger"><button type="button" class="close" data-dismiss="alert"><span>×</span><span class="sr-only">Close</span></button><span class="text-semibold">Oops!</span> You forgot to fill in all fields</a>!</div>';
$errors = 1;
}
else
{
$errors = 0;
}
//Validate Username
if ($errors == 0)
{
if (!ctype_alnum($username) || strlen($username) < 3 || strlen($username) > 15)
{
echo '<div class="alert bg-danger"><button type="button" class="close" data-dismiss="alert"><span>×</span><span class="sr-only">Close</span></button><span class="text-semibold">Oops!</span> Username is not valid</a>!</div>';
$errors = 1;
}
else
{
$errors = 0;
}
}
//Check If Username Is Taken
if ($errors == 0)
{
$SQL = $odb -> prepare("SELECT COUNT(*) FROM `users` WHERE `username` = :username");
$SQL -> execute(array(':username' => $username));
$countUser = $SQL -> fetchColumn(0);
if ($countUser > 0)
{
echo '<div class="alert bg-danger"><button type="button" class="close" data-dismiss="alert"><span>×</span><span class="sr-only">Close</span></button><span class="text-semibold">Oops!</span> Username is already in use</a>!</div>';
$errors = 1;
}
else
{
$errors = 0;
}
}
//Validate Email
if ($errors == 0)
{
if (!filter_var($email, FILTER_VALIDATE_EMAIL))
{
echo '<div class="alert bg-danger"><button type="button" class="close" data-dismiss="alert"><span>×</span><span class="sr-only">Close</span></button><span class="text-semibold">Oops!</span> Email is not valid</a>!</div>';
$errors = 1;
}
else
{
$errors = 0;
}
}
//Check If Email In Use
if ($errors == 0)
{
$SQL = $odb -> prepare("SELECT COUNT(*) FROM `users` WHERE `email` = :email");
$SQL -> execute(array(':email' => $email));
$countEmail = $SQL -> fetchColumn(0);
if ($countEmail > 0)
{
echo '<div class="alert bg-danger"><button type="button" class="close" data-dismiss="alert"><span>×</span><span class="sr-only">Close</span></button><span class="text-semibold">Oops!</span> Email is already in use</a>!</div>';
$errors = 1;
}
else
{
$errors = 0;
}
}
//Check Passwords
if ($errors == 0)
{
if ($password != $repeatpassword)
{
echo '<div class="alert bg-danger"><button type="button" class="close" data-dismiss="alert"><span>×</span><span class="sr-only">Close</span></button><span class="text-semibold">Oops!</span> Passwords do not match</a>!</div>';
$errors = 1;
}
else
{
$errors = 0;
}
}
//Check Captcha
if ($errors == 0)
{
if ($captcharesult == $answer)
{
$errors = 0;
}
else
{
echo '<div class="alert bg-danger"><button type="button" class="close" data-dismiss="alert"><span>×</span><span class="sr-only">Close</span></button><span class="text-semibold">Oops!</span> Captcha is invalid</a>!</div>';
$errors = 1;
}
}
}
?>
926
asked Mar 22 '26 18:03
There are several things I would like to point out. First, when you click on Register button, you'll get this error:
TypeError: register is not a function
The reason is, the <form> tag in your html code has name="register" just like the name of the function. And because of that some browsers can access the node elements just by specifying the name in the js code and then the function defined is overridden by the element in the DOM.
So you need to change the function name or the attribute name in <form> tag. I've changed the function name from register() to registration().
Second, change var rpassword=$('#rpassword').val(); to var rpassword=$('#repeatpassword').val();
And third, in your send() function, change ..."&repeatpassword=" + repeatpassword + "&email="... to ..."&repeatpassword=" + rpassword+ "&email="...
Solution:
Your HTML and JavaScript code should be like this:
// your code
<button type="button" onclick="registration()" class="btn bg-primary btn-block btn-lg">Register</button>
// your code
<script>
function registration(){
var username=$('#username').val();
var password=$('#password').val();
var rpassword=$('#repeatpassword').val();
var email=$('#email').val();
var captcharesult=$('#captcharesult').val();
var answer="<?php echo $answer; ?>";
document.getElementById("registerdiv").style.display="none";
var xmlhttp;
if (window.XMLHttpRequest){
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}else{
// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById("registerdiv").innerHTML=xmlhttp.responseText;
document.getElementById("registerdiv").style.display="inline";
if (xmlhttp.responseText.search("Redirecting") != -1){
setInterval(function(){window.location="google.com"},3000);
}
}
}
xmlhttp.open("POST","login.php?type=register",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("username=" + username + "&password=" + password + "&repeatpassword=" + rpassword + "&email=" + email + "&captcharesult=" + captcharesult + "&answer=" + answer);
}
</script>
And your login.php page should be like this:
<?php
if(isset($_POST['answer']) && isset($_POST['captcharesult']) && isset($_POST['email']) && isset($_POST['password']) && isset($_POST['repeatpassword']) && isset($_POST['username'])){
if(isset($_GET['type']) && $_GET['type'] == "register"){
//Get Registration Info
$username = $_POST['username'];
$email = $_POST['email'];
$password = $_POST['password'];
$repeatpassword = $_POST['repeatpassword'];
$captcharesult = $_POST['captcharesult'];
// now the rest of your code
}
}
?>
Sidenote: Use jQuery.ajax() instead of native ajax, it's much more simple and elegant.
96
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
