submit form after the fade finishes

submit form after the fade finishes

Howdy all.. I'm new to jQuery so bear with me..

I have a login form on the middle my page.. When the user types in their username and password I want the form to fade away.. THEN submit.

Right now when the user shows up to the page the form fades in.. you edit it and submit it... it fades out correct but thats it..

I've used a timeout to fire the submit a second time with a "true" flag and that appears to get called.. but it doesn't submit the form.. This is very likely the wrong way to go about this..

$(window).load(function() {
$('div.hiddenLoginDialog').fadeIn(1000, function() {
$('input#username').focus();
});
});

$(document).ready(function(){
submitIt = false;
$("form").submit(function() {
if (submitIt) {
return true;
} else {
var errors = false;

// @TODO: Validate here

if (!errors) {
$('div.hiddenLoginDialog').fadeOut('fast');
submitIt = true;
setTimeout('$("form").submit();',500);
return false;
}
}

return true;
});
});


The issue is if on submit I simply say
$('div.hiddenLoginDialog').fadeOut('fast');
return true;

It returns before the fade out.

Suggestions?