第一次使用预准备语句但查询未激活

Question

I have just started using prepared statements as it was brought to my attention by another user. However, after I started to implement it, it doesn't seem to properly add the new record to the database. When I click on Submit, it just shows the register success div that I have setup.

login.php (Where the form is located)

<form id="signupform" class="form-horizontal" role="form" method="post">
    <div class="form-group">
        <label for="username" class="col-md-3 control-label">Username</label>
        <div class="col-md-9">
            <input type="text" class="form-control" name="username" placeholder="Username">
        </div>
    </div>

    <div class="form-group">
        <label for="email" class="col-md-3 control-label">Email</label>
        <div class="col-md-9">
            <input type="text" class="form-control" name="email" placeholder="Email Address">
        </div>
    </div>
    <div class="form-group">
        <label for="password" class="col-md-3 control-label">Password</label>
        <div class="col-md-9">
            <input type="password" class="form-control" name="password" placeholder="Password">
        </div>
    </div>

    <div class="form-group">
        <label for="firstname" class="col-md-3 control-label">First Name</label>
        <div class="col-md-9">
            <input type="text" class="form-control" name="firstname" placeholder="First Name">
        </div>
    </div>
    <div class="form-group">
        <label for="lastname" class="col-md-3 control-label">Last Name</label>
        <div class="col-md-9">
            <input type="text" class="form-control" name="lastname" placeholder="Last Name">
        </div>
    </div>

    <div class="form-group">
        <label for="age" class="col-md-3 control-label">Age</label>
        <div class="col-md-9">
            <input type="text" onkeypress='return event.charCode >= 48 && event.charCode <= 57' maxlength="3" class="form-control" name="age" placeholder="Age">
        </div>
    </div>

    <div class="form-group">
        <label for="region" class="col-md-3 control-label">Region</label>
        <div class="col-md-9">
            <input type="text" class="form-control" name="region" placeholder="Region">
        </div>
    </div>

    <div class="form-group">
        <label for="address" class="col-md-3 control-label">Address</label>
        <div class="col-md-9">
            <input type="text" class="form-control" name="address" placeholder="Address">
        </div>
    </div>

    <div class="form-group">
        <label for="Postcode" class="col-md-3 control-label">Postcode</label>
        <div class="col-md-9">
            <input type="text" class="form-control" name="postcode" placeholder="Postcode">
        </div>
    </div>

    <div class="form-group">
        <label for="language" class="col-md-3 control-label">Language</label>
        <div class="col-md-9">
            <input type="text" class="form-control" name="language" placeholder="Language">
        </div>
    </div>

    <div class="form-group">
    <!-- Button -->                                        
        <div class="col-md-offset-3 col-md-9">
        <button id="btn-signup" type="submit" class="btn btn-info"><i class="icon-hand-right"></i>Submit</button>
         </div>
    </div>
</form>

JavaScript:

        <script type="text/javascript">
        $(function() {
            $("#signupform").bind('submit',function() {
                var username = $('#username').val();
                var email = $('#email').val();
                var password = $('#password').val();
                var firstname = $('#firstname').val();
                var lastname = $('#lastname').val();
                var age = $('#age').val();
                var region = $('#region').val();
                var address = $('#address').val();
                var postcode = $('#postcode').val();
                var language = $('#language').val();
                $.post('scripts/register.php',{username:username, email:email, password:password, firstname:firstname, lastname:lastname, age:age, region:region, address:address, postcode:postcode, language:language}, function(data){
                    $('#signupsuccess').show();
                }).fail(function(){{
                    $('#signupalert').show();
                }});
                return false;
            });
        });
    </script>

register.php

<?php
include 'connection.php';
if($conn->connect_error){
    die("Connection failed: " . $conn->connect_error);
}
$stmt = $conn->prepare("INSERT INTO `users` (`ID`, `Username`, `Password`, `Email`, `First_Name`, `Last_Name`, `Age`, `Region`, `Address`, `Postcode`, `Language`) VALUES ('NULL', '?', '?', '?', '?', '?', '?', '?', '?', '?', '?')");
$stmt->bind_param(NULL, $username, $password, $email, $firstName, $lastName, $age, $region, $address, $postcode, $language);

$username = $_POST['username'];
$password = password_hash($_POST['password'], PASSWORD_DEFAULT);
$email = $_POST['email'];
$firstName = $_POST['firstname'];
$lastName = $_POST['lastname'];
$age = $_POST['age'];
$region = $_POST['region'];
$address = $_POST['address'];
$postcode = $_POST['postcode'];
$language = $_POST['language'];
$stmt->execute();
$stmt->close();
?>

Answer 1

You're getting values from elements you think have id's (like #username) but none of your inputs has id="username". You can either add the id's to your input elements or you can change your selectors, e.g. $('[name="username"]')