prevent form from POSTing until javascript code is satisfied

[grr07]

whenever i click on submit button it fires \[code\]alert("empty username")\[/code\] but goes a head and directs me to \[code\]checklogin.php\[/code\]...how can i avoid that and let it remain on the page unless the field is not empty?\[code\]</body></html><script type="text/javascript"></script> function RequiredFields(){ var username=document.forms["login"]["username"].value; if (username==""||username==null){ alert("empty username") document.login.username.focus(); if(document.all||document.getElementById){ return false; } }}</script><form action="checklogin.php" method="POST" onSubmit="RequiredFields()">Username<input type="text" name="username"/>Password<input type="password" name="password"/><input type="submit" value="http://stackoverflow.com/questions/12749617/Login" /></form></body></html>\[/code\]