Question

Need some help with a login form please.

I’ve set up a login form through ajax, but it’s not working when the username/password are incorrect.
The php script works perfectly when not used through ajax. It does what it’s supposed to.
When submitting it through an ajax call, if the details are incorrect a new form pops up and asks for you to try again. That’s good, but I can’t resubmit the form. Clicking on the Submit link doesn’t work.

Here’s the code:
As an aside, the ajax doesn’t use “submit()” to load the ajax. There is a separate link outside the form that needs to be on a “click()”.

<script>
$(document).ready(function(){
    $("#login_submit").click(function() {
        $("#form2").hide();
        $('#finish').html('Attempting Login');
      var username = $("input#username").val();
      var password = $("input#password").val();     
            $.ajax({
              url: 'auth.php',
              type: "POST",
              data: "username="+username+"&password="+password+"",  
              success: function(data) {
                    $('#finish').html(data);
              }
            });


    });         
});
$(document).ajaxStart(function(){
  $('#loading').show();
}).ajaxStop(function(){
  $('#loading').hide();
});
</script>
<div id="form2">
<form method="post" id="login">
<input type="text" name="username" id="username"/><br />
<input type="text" name="password" id="password"/><br />

</form>
<span id="login_submit">Submit</span>
</div>

<div id="loading">
Loading...<img src="loading/loading6.gif" width="105" height="16" alt="loading" />
</div>
<div id="finish">

</div>

So as I said, it loads the form to resubmit, but clicking on “Submit” doesn’t resend the information.
Any tips for getting this to resubmit?

Answer 1

Answered my own question, sorry guys.

I changed the ajax to check for certain data being returned in the success callback, and changed the form based on that data, instead of replacing the form completely.

I’ll post the changes in a bit