setTimout never works properly!!

Please understand that this has been an on going problem for me over many many scripts I have wrote and I am getting sick of having to find alternative solution just because a BUILT IN JavaScript feature decides its just not going to work today...:mad:

So without further ado, tell me what might I be doing that is so wrong here??

This script validates a form by checking each form fields length and returns true or false back to our form. If all fields have been validated then it begins two functions. First function is to send the information to my database via AJAX the second is to open up a div box with the message of "Thank You".

After AJAX post has been complete I call a third function the turns off the "Thank You" message, however I dont want this message to go away until after 10 seconds, unfortunately cause setTimeout is being a butt head YET AGAIN I don't know why it wont stay up for more than a second.

function validate()
{
var storeName = document.getElementById("storeName").value;
var storeName = storeName.length;

var address = document.getElementById("address").value;
var address = address.length;

var state = document.getElementById("state").value;
var state = state.length;

var zip = document.getElementById("zip").value;
var zip = zip.length;

var phoneNumber = document.getElementById("phoneNumber").value;
var phoneNumber = phoneNumber.length;

var date = document.getElementById("startDate").value;
var date = date.length;

var time = document.getElementById("time").value;
var time =time.length;

var amPm = document.getElementById("amPm").value;
var amPm = amPm.length;

if(storeName == 0)
{alert("Sorry but you must provide a store name."); return false;}
else
{
if(address == 0)
{alert("Sorry but you must provide a store address."); return false;}
else
{
if(state == 0)
{alert("Sorry but you must provide a state."); return false;}
else
{
if(zip == 0)
{alert("Sorry but you must provide a zip code."); return false;}
else
{
if(phoneNumber == 0)
{alert("Sorry but you must provide a phone number."); return false;}
else
{
if(date == 0)
{alert("Sorry but you must provide a starting date for your tea party."); return false;}
else
{
if(time == 0)
{alert("Sorry but you must provide a starting time for your tea party."); return false;}
else
{
if(amPm == 0)
{alert("Sorry but will your tea party be in the AM or PM?"); return false;}
else
{saveStore(); openThanks(); return true;}
}
}
}
}
}
}
}
}


function saveStore()
{
function createpoststring()
{

var storeName = document.getElementById("storeName").value;
var address = document.getElementById("address").value;
var state = document.getElementById("state").value;
var zip = document.getElementById("zip").value;
var phoneNumber = document.getElementById("phoneNumber").value;
var startDate = document.getElementById("startDate").value;
var email = document.getElementById("email").value;
var time = document.getElementById("time").value;
var amPm = document.getElementById("amPm").value;

var poststr = "storeName=" + encodeURI(storeName) +
"&address=" + encodeURI(address) +
"&state=" + encodeURI(state) +
"&zip=" + encodeURI(zip) +
"&email=" + encodeURI(email) +
"&phoneNumber=" + encodeURI(phoneNumber) +
"&startDate=" + encodeURI(startDate) +
"&time=" + encodeURI(time) +
"&amPm=" + encodeURI(amPm);

return poststr;
}
createpoststring();
var poststr = createpoststring(); //Get contents to post and create query string first
ajaxpack.postAjaxRequest("saveToDatabase.php", poststr, createpoststring, "html");
setTimeout("closeThanks();",10000);

}


function openThanks()
{
var thankYou = document.getElementById("thankYou");
thankYou.style.display="block";
}

function closeThanks()
{
var thankYou = document.getElementById("thankYou");
thankYou.style.display="none";
}

The timeout for closeThanks is called as soon as it is read in the post function, before the openThanks is called. Are you sure the AJAX is asynchronous?

Put the closeThanks timeout at the end of the openThanks function.

Hi mrhoo, yeah the Ajax is asynchronous, its the same one I use here at my site for CMS Instant Edit (http://www.devinrolsen.com/portfolio/demos/php_mysql/cms/index.php). Its a lib file that has post and get ajax so the code might look a little diffrent than what we are use to ajax looking like.

Anywho adding the closeThanks timeout at the end of the openThanks function did nothing to fix the situation. I have my form setup like this, would this have anything to do with it?

<form onsubmit="return validate()">
//form fields
//form fields
//form fields
<input type="submit" value="Submit" />
</form>

Maybe its performing both a form submit and Ajax in one, and because its performing a true form submit my closeThanks never gets a chance to get called...?

Is it possible the page is refreshed/reloaded onsubmit?

Yeah it looks like the page is refreshing even though there is no method or action taking place in my form. So now I am left with the question of how the heck am I suppose to perform a proper validation over my form fields with Ajax if a onsubmit="return validate()" indeed refreshes the page :(