I have an html page that contains 2 forms, one for sign up and the other for sign in, and each have a submit button. The problem is that when I click these buttons nothing happens despite that the form action pages have been set. I am using netbeans and wamp server and I tried to run the project directly from the php pages (instead of the html page) and I got the needed response "Connected successfully".
Here is the complete html page :
<!DOCTYPE html>
<html>
<head>
<title>Sign Up</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://code.jquery.com/jquery-3.2.1.min.js"
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
crossorigin="anonymous"></script>
<!----------------------------------jQuery Validate---------------------------------->
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.12.0/jquery.validate.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.12.0/additional-methods.js"></script>
<!------------------------------------------------------------------------------------------------>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js"
integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh"
crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css"
integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb"
crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"
integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ"
crossorigin="anonymous"></script>
<!--<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"
crossorigin="anonymous">-->
<!-- Website Font style -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">
<!-- Google Fonts -->
<link href='https://fonts.googleapis.com/css?family=Passion+One' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Oxygen' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="SignUpStyle.css" type="text/css">
</head>
<body>
<div class="container">
<div class="row main">
<div class="main-login main-center">
<h5>Sign Up</h5>
<form action="SignUp.php" method="post" id="signupForm">
<div class="form-group">
<label for="fn" class="cols-sm-2 control-label">Firstname</label>
<div class="cols-sm-10">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-user fa" aria-hidden="true"></i></span>
<input type="text" class="form-control" name="fn" id="fn"
placeholder="Enter your firstname"/>
</div>
</div>
</div>
<div class="form-group">
<label for="ln" class="cols-sm-2 control-label">Lastname</label>
<div class="cols-sm-10">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-user fa" aria-hidden="true"></i></span>
<input type="text" class="form-control" name="ln" id="ln"
placeholder="Enter your lastname"/>
</div>
</div>
</div>
<div class="form-group">
<label for="email" class="cols-sm-2 control-label">Email</label>
<div class="cols-sm-10">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-envelope fa" aria-hidden="true"></i></span>
<input type="email" class="form-control" name="email" id="email"
placeholder="Enter your Email"/>
</div>
</div>
</div>
<div class="form-group">
<label for="password" class="cols-sm-2 control-label">Password</label>
<div class="cols-sm-10">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span>
<input type="password" class="form-control" name="password" id="password"
placeholder="Enter your Password"/>
</div>
</div>
</div>
<div class="form-group">
<label for="confirm" class="cols-sm-2 control-label">Confirm Password</label>
<div class="cols-sm-10">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span>
<input type="password" class="form-control" name="confirm" id="confirm"
placeholder="Confirm your Password"/>
</div>
</div>
</div>
<div class="form-group">
<input id="submit" type="submit" value="Register" name="submit" form="signupForm"
class="btn btn-primary btn-lg btn-block login-button">
<div id="agreeDiv">
<input id="agreeId" type="checkbox" value="agree"/>
<label id="agreeLbl">I accept the terms and conditions</label>
</div>
</div>
<div class="form-group">
<span id="signInSpan">Already have an account?<button id="signInBtn">Sign In!!</button></span>
</div>
</form>
<form method="post" action="SignIn.php" id="signinForm">
<div class="form-group">
<label for="email2" class="cols-sm-2 control-label">Email</label>
<div class="cols-sm-10">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-envelope fa" aria-hidden="true"></i></span>
<input type="email" class="form-control" name="email2" id="email2"
placeholder="Enter your Email"/>
</div>
</div>
</div>
<div class="form-group">
<label for="password2" class="cols-sm-2 control-label">Password</label>
<div class="cols-sm-10">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span>
<input type="password" class="form-control" name="password2" id="password2"
placeholder="Enter your Password"/>
</div>
</div>
</div>
<div class="form-group">
<button id="submit2" type="submit" class="btn btn-primary btn-lg btn-block login-button">Login</button>
</div>
<div class="form-group">
<span id="signUpSpan">Don't have an account?<button id="signUpBtn">Sign Up!!</button></span>
</div>
</form>
</div>
</div>
</div>
<script src="SignUpIn.js"></script>
</body>
And that's the signup.php page:
<?php
$servername = "localhost";
$username = "root";
$password = "";
$db = "projetpw";
$port = 3308;
$conn = mysqli_connect($servername, $username, $password, $db ,$port);
if(!$conn){
die("Connection failed : ".mysqli_connect_error());
}
else{
$jq = '<script type="text/javascript">'
. 'alert("Connected Successfully");'
. '</script>';
echo $jq;
}
Any help would be appreciated.
