<?php
    $title = "Add User";
    error_reporting(E_ALL);
    include("php/HeaderMain.php");
    require 'php/db_config.php';

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

        $FirstName = !empty($_POST['FirstName']) ? $_POST['FirstName'] : '';
        $LastName = !empty($_POST['LastName']) ? $_POST['LastName'] : '';
        $EmailAddress = !empty($_POST['EmailAddress']) ? $_POST['EmailAddress'] : '';
        $Username = !empty($_POST['Username']) ? $_POST['Username'] : '';
        $Password = !empty($_POST['Password']) ? $_POST['Password'] : '';
        $ConfirmPassword = !empty($_POST['ConfirmPassword']) ? $_POST['ConfirmPassword'] : '';

        $ErrorList = array();

        if($Password == $ConfirmPassword) {



        } else {
            echo "NOT MATCH";

            $ErrorList[] = "Passwords must match.";

        }
        echo "<br><br>";

        echo '<pre>'; print_r($ErrorList); echo '</pre>';
    }

?>
    <div class="page-wrapper" id="edit-user">
        <div class="container">
            <div class="row">
                <div class="col-md-6 col-md-offset-3">
                    <div class="jumbotron" style="padding: 50px;">

                    <div id="div_ErrorList" style="display: none;">

                        Test

                    </div>

                        <h2 class="display-4">Add User</h2> <hr class="my-4"> <br>
                            <form action="adduser.php" method="post" id="AddUser" role="form">
                                <div class="form-group row">
                                     <label for="FirstName" class="col-1 col-form-label">First Name</label>
                                     <div class="col">
                                         <input class="form-control" type="text" name="FirstName" maxlength="40">
                                     </div>
                                </div>
                                <div class="form-group row">
                                     <label for="LastName" class="col-1 col-form-label">Last Name</label>
                                     <div class="col">
                                         <input class="form-control" type="text" name="LastName" maxlength="40">
                                     </div>
                                </div>
                                <div class="form-group row">
                                    <label for="EmailAddress" class="col-2 col-form-label">Email</label>
                                    <div class="col">
                                        <input class="form-control" type="email" name="EmailAddress" maxlength="60">
                                    </div>
                                </div>
                                <div class="form-group row">
                                     <label for="Username" class="col-1 col-form-label">Username</label>
                                     <div class="col">
                                         <input class="form-control" type="text" name="Username" maxlength="15">
                                     </div>
                                </div>
                                <div class="form-group row">
                                     <label for="Password" class="col-1 col-form-label">Password</label>
                                     <div class="col">
                                         <input class="form-control" type="password" name="Password" maxlength="15" id="Password">
                                     </div>
                                </div>
                                <div class="form-group row">
                                     <label for="ConfirmPassword" class="col-1 col-form-label">Confirm Password</label>
                                     <div class="col">
                                         <input class="form-control" type="password" name="ConfirmPassword" maxlength="15" id="ConfirmPassword">
                                     </div>
                                </div>
                                <br>
                                <div class="center-align">
                                    <button type="submit" class="btn btn-primary" name="Submit" onclick="ShowErrors()">Submit</button>
                                </div>
                            </form>
                    </div>
                </div>
            </div>
        </div>

        <?php
            include("php/FooterMain.php");
        ?>

        <script>

        function ShowErrors() {

            var FirstName = $('#FirstName').value;

            if (FirstName != ""){
                div_ErrorList.style.display="";
            }


        };

        </script>