Untitled

<?php
$servername = "localhost";
$username = "root";
$password = "root";
$dbname = "mycms";
$uname = $_POST['user'];
$pword = $_POST['password'];
$fname = $_POST['firstname'];
$lname = $_POST['lastname'];
$gender = $_POST['gender'];
$agegroup = $_POST['ageGroup'];
$province = $_POST['province'];

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}

$sql = "INSERT INTO users (user, password, firstname, lastname, gender, ageGroup, province)
VALUES ('$uname', '$pword', '$fname', '$lname', '$gender', '$agegroup', '$province')";

if ($conn->query($sql) === TRUE) {
    echo "New record created successfully";
} else {
    echo "Error: " . $sql . "<br>" . $conn->error;
}

$conn->close();

?>
<!DOCTYPE html>
<html>

    <head>
        <title>Sign UP Form</title>
        <link rel="stylesheet" type="text/css" href="css/style.css">
    </head>
    <body>

 <table align="center" width="500px">
 <form id="myform" action="signup.php" method="post" onSubmit="return validateForm();">

<tr>
<td colspan="2"><div id="errmsg"></div></td>
</tr>

<tr>
<td><label>Username</label></td>
<td><input type="text" id="user" name="user"></td>
</tr>

<tr>
<td><label>Password</label></td>
<td><input type="password" id="password" name="password"></td>
</tr>

<tr>
<td><label>Confirm Password</label> </td>
<td><input type="password" id="confirmpwd" name="confirmpwd"></td>
</tr>

<tr>
<td><label>First Name</label> </td>
<td><input type="text" id="firstname" name="firstname"></td>
</tr>

<tr>
<td><label>Last Name</label> </td>
<td><input type="text" id="lastname" name="lastname"></td>
</tr>


<tr>
<td><label id="genderlabel">Gender</label> </td>
<td><input type="radio" name="gender" value="male"> Male<br>
	<input type="radio" name="gender" value="female"> Female<br>
	<input type="radio" name="gender" value="other"> Other
</td>
</tr>
<!-- How to connect gender?-->

<tr>
<td><label>Province</label></td>
<td><select name="province">
<option value="AB">Alberta</option>
<option value="BC">British Columbia</option>
<option value="MB">Manitoba</option>
<option value="NB">New Brunswick</option>
<option value="NL">Newfoundland and Labrador</option>
<option value="NS">Nova Scotia</option>
<option value="ON" selected>Ontario</option>
<option value="PE">Prince Edward Island</option>
<option value="QC">Quebec</option>
<option value="SK">Saskatchewan</option>
<option value="NT">Northwest Territories</option>
<option value="NU">Nunavut</option>
<option value="YT">Yukon</option>
</select>
</td>
</tr>

<tr>
<td>Age Group</td>
<td><select id="age" name="ageGroup">
<option value="0-12">Upto 12</option>
<option value="Above12">Above 12</option>
</select>
</td>
</tr>

<tr>
<td colspan="2"><input type="submit" value="Sign Up"></td>
<td>
</td>


</form>


</table>
        <script>
            function validateForm()
			{

					var username = myform.user.value;
					var pwd = myform.password.value;
					var confirmpwd = myform.confirmpwd.value;
					var fname = myform.firstname.value;
					var lname = myform.lastname.value;
					var gender = myform.gender.value;
					var age = myform.ageGroup.value;
					var province = myform.province.value;


					var genderval = document.getElementsByName("gender");

					for(var i = 0; i < genderval.length; i++) {
						if(genderval[i].checked == true) {
							var genderchoice = genderval[i].value;
						}
					}

					var province = myform.province.value;

					var age = myform.age.value;


					//validating form data

					var errmsgs=new Array();
					var flag=true;

					if(username == null || username == ""){
						errmsgs.push("Please Enter Username");
						flag=false;
					}
					if(username.length < 6 || username.length > 30){
						errmsgs.push("Length of User name must be between 6 to 30");
						flag=false;
					}
					if(pwd == null || pwd == ""){
						errmsgs.push("Please enter the Password");
						flag=false;
					}
					if(pwd.length < 8 || pwd.length > 20){
						errmsgs.push("Password length must be between 8 to 20");
						flag=false;
					}
					if(confirmpwd != pwd){
						errmsgs.push("Passwords not match");
						flag=false;
					}
					if(fname == null || fname == ""){
						errmsgs.push("First name cannot be empty");
						flag=false;
					}
					if(lname == null || lname == ""){
						errmsgs.push("Last name cannot be empty");
						flag=false;
					}
					if(gender == null){
						errmsgs.push("Please select the gender");
						flag=false;
					}
					if(province == null){
						errmsgs.push("Province must be selected");
						flag=false;
					}

					if(age == null || age=="0-12"){
						errmsgs.push("You must be older than 12");
						flag=false;
					}

					else
						{
						flag=true;
					}


				var allerrors="<ul>";
				for(var x in errmsgs)
					{
						allerrors += "<li>" + errmsgs[x] + "</li>";
					}
				allerrors+="</ul>";

				if(flag==false){
					document.getElementById('errmsg').innerHTML=allerrors;
				}

				return flag;

}
        </script>

    </body>
</html>