[SOLVED] The Enter button not working on Login page

The Enter button not working on Login page

I just made a login system but I can only login with pressing the button on my screen, not using the enter button on my keyboard. How can I enable this? I read something about the AcceptButton, but how do I apply this?

my code:

login.php

<?php

    require('inc/functions.php');

    session_start();

    if(checkLogedIn()){
        header("location:index.php");
        die();
    }

    include 'inc/header.php'

?>

<body>
    <div id="wrap">
                <div class="text-center">
                    <img src="img/logo.png" height="125" width="125">
                </div>
        <div class="row">
            <div class="col-xs-10 col-xs-offset-1 col-sm-8 col-sm-offset-2 col-md-4 col-md-offset-4">
                <div class="login-panel panel panel-default">
                    <div class="panel-heading">Inloggen</div>
                    <div class="result"></div>
                    <div class="panel-body">
                        <form role="form" id="loginForm">
                            <fieldset>
                                <div class="form-group">
                                    <input class="form-control" placeholder="Gebruikersnaam" name="username" type="text" autofocus="">
                                </div>
                                <div class="form-group">
                                    <input class="form-control" placeholder="Wachtwoord" name="password" type="password">
                                </div>

                                <div class="row">
                                    <div class="col-xs-7">
                                        <a href="#" class="btn btn-success post">Inloggen</a>
                                    </div>
                                </div>
                            </fieldset>
                        </form>
                    </div>
                </div>
            </div><!-- /.col-->
        </div><!-- /.row -->    
    </div>
    <footer class="footer">
        <div class="text-center">
            <p class="text-muted">&copy; <?php echo date("Y"); ?> company name</p>
        </div>
    </footer>



    <script src="js/jquery-1.11.1.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script type="text/javascript">

        $( document ).ready(function() {
            $('.result').hide();
            $(".post").on("click",function(){
                // console.log('clicked!');

                var formData = $('#loginForm').serialize();

                $.ajax({
                    type: "POST",
                    url: "checkauth.php",
                    data: $("#loginForm").serialize(), // serializes the form's elements.
                    success: function(data){
                        //window.location.href = "/welcome";
                        // console.log(data);
                         if(data.status2 == 'success'){
                            // 

                            $('.panel-body').fadeOut(1400);
                            $('.result').html(data.message);
                            $('.result').fadeIn(1200);
                            window.setTimeout(function() {
                                window.location.href = 'index.php';
                            }, 2000);

                        }else {
                            $('.result').html(data.message);
                        }
                    }
                });
             });
        });
    </script>
</body>

</html>

checkauth.php

<?php

session_start();

/* Check Login form submitted */    
    if($_SERVER['REQUEST_METHOD'] == 'POST'){
        header('Content-Type: application/json');

        /* Define username and associated password array */
        $logins = array('admin' => 'admin2',
                        'username1' => 'password1',
                        'username2' => 'password2');

        /* Check and assign submitted Username and Password to new variable */
        $Username = isset($_POST['username']) ? $_POST['username'] : '';
        $Password = isset($_POST['password']) ? $_POST['password'] : '';


        // print_r($_POST);

        /* Check Username and Password existence in defined array */        
        if (isset($logins[$Username]) && $logins[$Username] == $Password){
            /* Success: Set session variables and redirect to Protected page  */
            $_SESSION['UserData']['Username']=$logins[$Username];
            $_SESSION['UserData']['loggedin']=TRUE;

            $return['message'] =  '<br><div class="alert alert-success" role="alert">Login gegevens correct, welkom!</div><br>';
            $return['status2'] = 'success';

        } else {
            /*Unsuccessful attempt: Set error message */
            $return['message'] =  '<div class="alert alert-danger" role="alert">Incorrecte login gegevens. Probeer het aub. opnieuw.</div>';
            $return['status2'] = 'error';  

        }
        echo json_encode($return);
    }
    else{
        exit('No direct acces to this script!');
    }
?>

Can anyone help ?

Solution

To make enter button to work you can use

<input type="submit">

Rather then

<a href="#" class="btn btn-success post">Inloggen</a>