Boostrap Form with PHP, MySQL not sending data to database

Question

I've been trying to debug this for ages now and don't understand why is it not sending data to my database. Also as an indication, I'm using Boostrap and this form is inside of a modal. Can someone help me out please. I will include my html snipet as well as php code.

HTML CODE

<form class="form-horizontal" role="form" action="register.php" method="POST">
      <div class="input-group margin-bottom-sm"><span class="input-group-addon"><i class="glyphicon glyphicon-user" aria-hidden="true"></i></span>                        <input class="form-control" type="text" name="fname" id="FirstName" placeholder="First Name" required>
           </div></br>
          
        <div class="input-group"><span class="input-group-addon"><i class="glyphicon glyphicon-user" aria-hidden="true"></i></span>
                    <input class="form-control" type="text" name="lname" id="LastName" placeholder="Last Name" required>
        </div></br>
        
        <div class="input-group"><span class="input-group-addon"><i class="glyphicon glyphicon-calendar" aria-hidden="true"></i></span>
                    <input class="form-control" type="text" name="dob" id="dob" placeholder="Date of Birth" required>
        </div><br>
        
        <div class="input-group"><span class="input-group-addon"><i class="glyphicon glyphicon-book" aria-hidden="true"></i></span>
                    <input class="form-control" type="text"  name="school" id="SchoolName" placeholder="School" required>
        </div></br>
    
        <div class="input-group"><span class="input-group-addon"><i class="glyphicon glyphicon-user" aria-hidden="true"></i></span>
                    <input class="form-control" type="text" name="username" id="Username" placeholder="Username" required>
        </div></br>
      
        <div class="input-group"><span class="input-group-addon"><i class="glyphicon glyphicon-lock" aria-hidden="true"></i></span>
                    <input class="form-control" type="password"  name="pass" data-minlenght= "6" id="Pass" placeholder="Password" required> 
        </div><div class="help-block">Minimum of 6 characters</div></br></br>
        
        <div class="input-group"><span class="input-group-addon"><i class="glyphicon glyphicon-lock" aria-hidden="true"></i></span>
                    <input class="form-control" type="password" id="inputPasswordConfirm" data-match="#inputPassword"
                           data-match-error="Whoops, these don't match" placeholder="Confirm" required>
        </div></br>
    
        <div class="form-group">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="submit" class="btn btn-primary" id="register">Sing Up</button>
        </div>
    
        </form>

PHP

<?php

$conn=mysqli_connect("localhost","mydatabase","mypassword")
    or die("Could not connect:".mysqli_error($conn));
mysqli_select_db($conn , 'mydatabase') or die ('Database will not open');

if(isset($_POST['register'])){


    $fname = ($_POST['FirstName']);  
    $lname = ($_POST['LastName']);
    $dob = ($_POST['dob']);
    $school = ($_POST['SchoolName']);
    $username = ($_POST['Username']);
    $pass = ($_POST['Pass']);


    $query = "INSERT INTO users (FirstName,LastName,dob,SchoolName,Username,Pass)VALUES('$FirstName','$LastName','$Username','$dob', '$SchoolName','$Pass',)";
    $result = mysqli_query($conn,$query);
}
?>

Answer 1

So lets clear this up somewhat..

Firstly your query order is completely incorrect (take note of: FirstName,LastName,dob) this means the first 3 values should be $fname,$lname,$dob but instead you've added in $username for some reason..

NOTE: You were adding in non existent variables such as $FirstName when the actual assigned variable is in fact: $fname.

Your query (take note of the last variable $Pass,) because this is the last variable entry you don't add a comma take a look:

$query = "INSERT INTO users (FirstName,LastName,dob,SchoolName,Username,Pass)VALUES('$FirstName','$LastName','$Username','$dob', '$SchoolName','$Pass',)";

should be:

$query = "INSERT INTO users (`FirstName`,`LastName`,`dob`,`SchoolName`,`Username`,`Pass`)VALUES('$fname','$lname','$dob','$school','$username','$pass')";

Better still you could bind the params to prevent SQL Injection like below:

$query = "INSERT INTO users (`FirstName`,`LastName`,`dob`,`SchoolName`,`Username`,`Pass`)VALUES(?,?,?,?,?,?)";
$query->bind_param("ssssss", $fname, $lname, $dob, $school, $username, $pass);

Next up..

You're calling if(isset($_POST['register'])){

Yet your <button type="submit" class="btn btn-primary" id="register">Sing Up</button> has no name="register">

Therefore it should be: <button type="submit" class="btn btn-primary" id="register" name="register">Sing Up</button>

Also, you should never save a password as plain text to a database. You should run password_hash($pass, PASSWORD_DEFAULT); this will encrypt the passwords submitted to the database - Before doing so I recommend that you read up on the documentation.

Answer 2

It seems you didn't send $_POST['register'] to your register.php, so the if (isset($_POST['register'])) will evaluate to false and absolutely nothing will happen. The same goes for the other fields, you will only have values in the $_POST if you give your input-fields a name attribute.

Answer 3

Change

  <button type="submit" class="btn btn-primary" id="register">Sing Up</button>

To

  <button type="submit" class="btn btn-primary" id="register" name="register">Sing Up</button>

Also, with all your other $_POST variables you need to use the name field and not the id field.

Your SQL query also has a stray comma. Change it to

  $query = "INSERT INTO users (FirstName,LastName,dob,SchoolName,Username,Pass)VALUES('$FirstName','$LastName','$Username','$dob', '$SchoolName','$Pass')";

Answer 4

all your $_POST variables are undefined. You should use the name attribute from your form to assign $_POST values, not the ID from the inputs

<form class="form-horizontal" role="form" action="register.php" method="POST">
      <div class="input-group margin-bottom-sm"><span class="input-group-addon"><i class="glyphicon glyphicon-user" aria-hidden="true"></i></span>                        <input class="form-control" type="text" name="fname" id="FirstName" placeholder="First Name" required>
           </div></br>

        <div class="input-group"><span class="input-group-addon"><i class="glyphicon glyphicon-user" aria-hidden="true"></i></span>
                    <input class="form-control" type="text" name="lname" id="LastName" placeholder="Last Name" required>
        </div></br>

        <div class="input-group"><span class="input-group-addon"><i class="glyphicon glyphicon-calendar" aria-hidden="true"></i></span>
                    <input class="form-control" type="text" name="dob" id="dob" placeholder="Date of Birth" required>
        </div><br>

        <div class="input-group"><span class="input-group-addon"><i class="glyphicon glyphicon-book" aria-hidden="true"></i></span>
                    <input class="form-control" type="text"  name="school" id="SchoolName" placeholder="School" required>
        </div></br>

        <div class="input-group"><span class="input-group-addon"><i class="glyphicon glyphicon-user" aria-hidden="true"></i></span>
                    <input class="form-control" type="text" name="username" id="Username" placeholder="Username" required>
        </div></br>

        <div class="input-group"><span class="input-group-addon"><i class="glyphicon glyphicon-lock" aria-hidden="true"></i></span>
                    <input class="form-control" type="password"  name="pass" data-minlenght= "6" id="Pass" placeholder="Password" required> 
        </div><div class="help-block">Minimum of 6 characters</div></br></br>

        <div class="input-group"><span class="input-group-addon"><i class="glyphicon glyphicon-lock" aria-hidden="true"></i></span>
                    <input class="form-control" type="password" id="inputPasswordConfirm" data-match="#inputPassword"
                           data-match-error="Whoops, these don't match" placeholder="Confirm" required>
        </div></br>

        <div class="form-group">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="submit" class="btn btn-primary" id="register" name="register">Sing Up</button>
        </div>

        </form>

Then you should use prepared statements to save data in your db, even if you working on localhost, also dont store a plain text password in the database infact don't ever store passwords, just store hash value of the password using password_hash() and password_verify()

if(isset($_POST['register'])){


    //validate these
    $fname = ($_POST['fname']);  
    $lname = ($_POST['lname']);
    $dob = ($_POST['dob']);
    $school = ($_POST['school']);
    $username = ($_POST['username']);
    $pass = ($_POST['pass']);

    $hash = Password_hash($pass,PASSWORD_DEFAULT); //hash password

    $query = $conn->prepare("INSERT INTO users (FirstName,LastName,dob,SchoolName,Username,Pass) VALUES(?,?,?,?,?,?)");
    $query->bind_param("ssssss",$fname,$lname,$dob,$school,$username,$hash);

    if($query->execute()){

        echo "data inserted success";
    }
}
?>

Note: If we want to insert any data from external sources (like user input), it is very important that the data is sanitized and validated.

Then password_verify(); will work on your login page, what basically it does it compares the password entered by the user against the hash stored in the database.

for more about the password_hash() and password_verify(); have a look in the manual:

http://php.net/manual/en/function.password-hash.php

http://php.net/manual/en/function.password-verify.php

http://php.net/manual/en/mysqli.quickstart.prepared-statements.php prepared statements.