jQuery form authentication error

Question

I'm trying out this basic authentication using jQuery. But nothing happens when I enter a wrong username/password -- no alert is displayed nor is the label error shown.

Using Firebug, in the Response header, it shows: Login failed{"success":false} but no error is displayed on the page itself.

Even if the username/password is correct, it doesn't redirect the page to successful login page.

HTML:

<section>
    <form id="form" name="form" action="login.php" method="post">  

    <ul>
        <li>
        <span class="er">&nbsp;Error Message</span>
        </li> <br />

        <li>
        <label for="name">Name</label>  
        <input type="text" name="name" id="name" required />       
        </li>

        <li> 
        <label for="pass">Password</label>  
        <input type="password" name="pass" id="pass" required/>  
        </li>

    </ul>
        <input type="submit" value="Log In" />  

</form>  
</section>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> 
<script type="text/javascript">
    $(document).ready(function() {
        $(".er").hide();
        $('#form').bind('submit', function (e) {
            var self = $(this);

            // See ajax: http://api.jquery.com/jQuery.post
            // See serialize: http://api.jquery.com/serialize()
            jQuery.post(self.attr('action'), self.serialize(), function () {
                if (response.success) {
                    // wooo, logged in
                    window.location.href='home.php';
                } else {
                    $(".er").show();
                    alert("Invalid username or password. Please try again");
                }
            }, 'json');

            e.preventDefault(); //prevent the form being posted 
        });
});
</script>

PHP --login.php:

<?php
include "common/base.php";


include_once "inc/class.users.inc.php";
$users = new Admin($db);
if($users->accountLogin()==TRUE):
      echo "Login Successful " . $_SESSION['Username'];
      echo json_encode(array('success' => true));
      header("Location: home.php");
else:
     echo "Login failed";
     echo json_encode(array('success' => false));
endif;

?>

mattsven · Accepted Answer · 2011-04-07 17:17:05Z

1

Nothing is happening because you are not defining response. Change what you have to:

jQuery.post(self.attr('action'), self.serialize(), function (response){

answered Apr 7, 2011 at 17:17

mattsven

23.5k11 gold badges73 silver badges106 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

mattsven Over a year ago

Invalid JSON, then, seems like it may be the culprit in this case. In your PHP, you have echo "Login Successful " . $_SESSION['Username']; and echo "Login failed"; those lines are breaking the JSON response.

input Over a year ago

Thanks! That did it. I removed those lines, and it worked. However, how else would I pass the session to the next page?

mattsven Over a year ago

Why don't you add it to your JSON response? array('success' => true, 'username' => $_SESSION['Username'])

Craig M · Accepted Answer · 2011-04-07 17:19:14Z

0

You're response variable needs to be a parameter of the success callback like so:

jQuery.post(self.attr('action'), self.serialize(), function (response) {
                if (response.success) {
                    // wooo, logged in
                    window.location.href='home.php';
                } else {
                    $(".er").show();
                    alert("Invalid username or password. Please try again");
                }
}, 'json');

answered Apr 7, 2011 at 17:19

Craig M

5,6084 gold badges34 silver badges43 bronze badges

1 Comment

input Over a year ago

Tried that, the alert doesn't display.

Collectives™ on Stack Overflow

jQuery form authentication error

2 Answers 2

3 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related