Issues with BootstrapValidator.js

<?php
    session_start();
    include("dir.php");

    if (isset($_POST['submit'])) {
        // FORM SUBMIT CODE HERE
        // FORM SUBMIT CODE HERE
        // FORM SUBMIT CODE HERE
        // FORM SUBMIT CODE HERE
    }
    include($DOCROOT."head-defaults.php");
?>
<!-- ////////////////////////////////////////////////////
    ////////// Append the styles and scripts to the head -->
<script>
    $('head').append("<link href='<?php echo $DOCROOT; ?>assets/bootstrapvalidator-dist-0.5.3/js/bootstrapValidator.js' rel='stylesheet'>");
</script>
    <style>
        body{
            padding-top: 0px;
            background: url("<?php echo $DOCROOT; ?>assets/images/bg4.jpg");
            background-color: #525252;
        }
        .navbar .btn {
            margin-left: 3px;
        }

        .navbar {
            margin-bottom: 0px;
        }
        .centered-form{
            margin-top: 60px;
        }

        .centered-form .panel{
            background: rgba(255, 255, 255, 0.8);
            box-shadow: rgba(0, 0, 0, 0.3) 20px 20px 20px;
        }

        .has-feedback .form-control-feedback {
            top: 0px;
            right: 0;
        }
        .form-horizontal .has-feedback .form-control-feedback {
            top: 0;
            right: 15px;
        }
    </style>

    <div class="container">

        <div class="row centered-form">
                    <div class="col-xs-12 col-sm-8 col-md-4 col-sm-offset-2 col-md-offset-4">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h3 class="panel-title">Start using Project Titan <small>It's free!</small></h3>
                            </div>
                            <div class="panel-body">
                                <form role="form" id="signupForm" action="sign-up.php" method="POST" >
                                <div class="row">
                                    <div class="col-xs-12 col-sm-6 col-md-6">
                                        <div class="form-group">
                                            <input type="text" name="first_name" id="first_name" class="form-control input-sm" placeholder="First Name" tabindex="1">
                                        </div>
                                    </div>
                                    <div class="col-xs-12 col-sm-6 col-md-6">
                                        <div class="form-group">
                                            <input type="text" name="last_name" id="last_name" class="form-control input-sm" placeholder="Last Name" tabindex="2">
                                        </div>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <input type="email" name="email" id="email" class="form-control input-sm" placeholder="Email Address" tabindex="3">
                                </div>

                                <div class="row">
                                    <div class="col-xs-12 col-sm-6 col-md-6">
                                        <div class="form-group">
                                            <input type="password" name="password" id="password" class="form-control input-sm" placeholder="Password" tabindex="4">
                                        </div>
                                    </div>
                                    <div class="col-xs-12 col-sm-6 col-md-6">
                                        <div class="form-group">
                                            <input type="password" name="confirmPassword" id="confirmPassword" class="form-control input-sm" placeholder="Confirm Password" tabindex="5">
                                        </div>
                                    </div>
                                </div>

                                    <button type="submit" name="submit" id="submit" class="btn btn-primary btn-block">Register</button>
                                </form>

                            </div>
                        </div>
                    </div>
                </div>
        <div class="row col-md-6 col-md-push-3">
        <?php include($DOCROOT."assets/theme/server-response-msg.php"); ?>
        </div>
    </div>
<script>
    $(document).ready(function() {
        $('#signupForm').bootstrapValidator({
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                password: {
                    validators: {
                        identical: {
                            field: 'confirmPassword',
                            message: 'The password and its confirm are not the same'
                        }
                    }
                },
                confirmPassword: {
                    validators: {
                        identical: {
                            field: 'password',
                            message: 'The password and its confirm are not the same'
                        }
                    }
                },
            }
        });
    });
</script>
</body>
<?php include($DOCROOT."foot-defaults.php"); ?>
<script src="<?php echo $DOCROOT; ?>assets/bootstrapvalidator-dist-0.5.3/js/bootstrapValidator.js"></script>
</html>