jQuery, Trouble gettin form to submit if a certain value is return from server

[Chad Gary]

I have the following html form where the user enters username and password. I'm using ajax to send the values to a php page and in return depending on what the username and password is the php page sends a request back. It send a T if the username/password combination is correct and F if the username/password combination is wrong. All this works fine. I'm having trouble sumitting the form to the page specified in the form action if the server sends back T and if the server sends back F creating an alert message and return a false so the form doesn't submit.

Javascript (jQuery)

$(function()
{
 
		   
	$('#form1').bind ('submit', function (event)
		{
	var name = $('input[name = "username"]').val();
	var password = $('input[name = "password"]').val();
					
			$.ajax
			({
				
				type: "POST",
				url: "AjaxLoginPHP.php",
				data: {data: name + "/" + password},
				success: callback
			});
			
			function callback(data, status)
			{
				if(data == "F")
				{
					alert("Password is Incorrect");
				
				}
			}			
				
				return false;
					
		})

});


</script>

HTML

<form action="AjaxLoginResults.php" method="post" id="form1">
<table>
<tr>
<td>Username :</td> 
<td><input type="text" name="username" id="username"></td>
</tr>

<tr>
<td>Password : </td>
<td><input type="password" name="password" id="password"></td>
</tr>

</table>
<br/>
<input name="submit" type="submit" value="Login">
</form>

AjaxLoginPHP.php

if($_POST['data'] == "cd_gary/test" )
{
	echo "T";
}
else
{
	echo "F";
}

[Atli]

Hey.

Try something like this:

$(document).ready(function()
{
    $('#form1').bind ('submit', form1_submit);

    function form1_submit()
    {
        var name = $('#username').val();
        var password = $('#password').val();

        $.ajax
        ({
            type: "POST",
            url: "test.php",
            data: {data: name + "/" + password},
            success: form1_submit_callback
        });

        return false;
    }

    function form1_submit_callback(data) {
        if(data == "F") {
            alert("Password is Incorrect");
        }
        else {
            $('#form1').unbind();
            $("input[name='submit']").click();
        }
    }
});

For some reason trying to submit the form directly using JavaScript doesn't work. It's like the form becomes inactive or something after it initially returns FALSE and/or has the onsubmit event unbound.
Having JavaScript "click" the submit button seems to work correctly, though.