I have these school project, somewhat like a 'signup' page on a typical website. I use external CSS on these code, a simple javascript and PHP file to verify the value of the input on the form. My problem is, the 'onblur' event on each 'input' object does not work on IE, FF, and Chrome. Here's the code for form: Code: <form name="signupform" id="signuptable" action="" method="POST"> <table cellpadding="0" cellspacing="0" id="formsignup" width="604"> <tr> <td width="160" class="forlabel"><label for="uname">User ID:</label></td> <td width="219" class="forinput"><input type="text" name="uname" id="uname" value="" maxlength="12"onBlur="javascript:check(this.name);" class="styleinput" /><a href="javascript:check('uname');">check</a></td> <td width="223" id=""><div id="hintLYR" style="width: 130px; position:relative; visibility:hidden; float:left; top:0; left:0; z-index:1; cursor:hand; background-color:#FFFFCC"> <table width=210 border=0 align="center" cellpadding=0 cellspacing=0 bgcolor="#FFFFCC" id="table34" style="border: 1px solid #CC6600;" nof="hint"> <tr valign=TOP align=LEFT> <td width=130 valign="middle"><span id="alertmsg"> </span> </td> </tr> </table> </div></td> </tr> <tr> <td class="forlabel"><label for="fname">First name:</label></td> <td class="forinput"><input type="text" name="fname" value="" id="fname" maxlength="20" onfocus="this.id='activeinput'" onblur="javascript:check('lname');" /></td> <td width="223" id=""><span id="error"><?php ?></span></td> </tr> <tr> <td class="forlabel"><label for="lname">Last name:</label></td> <td class="forinput"><input type="text" name="lname" id="fname" value="" maxlength="20" onfocus="this.id='activeinput'" onblur="this.id='inactiveinput'" /></td> <td width="223" id=""><span id="error"><?php ?></span></td> </tr> <tr> <td></td> </tr> <tr> <td class="forlabel"><label for="pwd">Password:</label></td> <td class="forinput"><input type="password" name="pwd" id="pwd" value="" maxlength="12" onfocus="this.id='activeinput'" onblur="this.id='inactiveinput'" /></td> <td width="223" id=""><span id="error"><?php ?></span></td> </tr> <tr> <td class="forlabel"><label for="pwdcon">Confirm Password:</label></td> <td class="forinput"><input type="password" name="pwd2" id="pwd2" value="" maxlength="12" onfocus="this.id='activeinput'" onblur="this.id='inactiveinput'" /></td> <td width="223" id=""><span id="error"><?php ?></span></td> </tr> <tr> <td height="32" class="forlabel"><label for="email">Email:</label></td> <td class="forinput"><input type="text" name="email" value="" id="email" maxlength="50" onfocus="this.id='activeinput'" onblur="this.id='inactiveinput'" /></td> <td width="223" id=""><span id="error"><?php ?></span></td> </tr> <tr> <td class="forlabel"><label for="emailcon">Retype your Email:</label></td> <td class="forinput"><input type="text" name="emailcon" value="" id="emailcon" maxlength="50" onfocus="this.id='activeinput'" onblur="this.id='inactiveinput'" /></td> <td width="223" id=""><span id="error"><?php ?></span></td> </tr> <tr> <td class="forlabel"><label for="bdate">Birth date:</label></td> <td class="forinput" valign="bottom"><span id="birdate"><select name="bdateday" "7"> <option value="1" selected="selected">01</option> <option value="2">02</option> <option value="3">03</option> <option value="4">04</option> <option value="5">05</option> <option value="6">06</option> <option value="7">07</option> <option value="8">08</option> <option value="9">09</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> <option value="15">15</option> <option value="16">16</option> <option value="17">17</option> <option value="18">18</option> <option value="19">19</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> <option value="24">24</option> <option value="25">25</option> <option value="26">26</option> <option value="27">27</option> <option value="28">28</option> <option value="29">29</option> <option value="30">30</option> <option value="31">31</option> </select> <select name="bdatemonth" "8"> <option value="Jan" selected="selected">Jan</option> <option value="Feb">Feb</option> <option value="Mar">Mar</option> <option value="Apr">Apr</option> <option value="May">May</option> <option value="Jun">Jun</option> <option value="Jul">Jul</option> <option value="Aug">Aug</option> <option value="Sep">Sep</option> <option value="Oct">Oct</option> <option value="Nov">Nov</option> <option value="Dec">Dec</option> </select> <select name="bdateyear" "9"><option value="1900" selected="selected">1900</option></select> </span></td> <td width="223" id=""></td> </tr> <tr> <td width="160"></td> <td class="forinput" colspan="2" ><br /> <textarea name="toc" wrap="virtual">Terms and conditions here</textarea></td> </tr> <tr> <td colspan="3" align="center" ><br /><input type="submit" name="register" value="REGISTER" style="height:30px; width:150px;" id="button" /></td> </tr> </table> </form> Javascript code: Code: <script> function x() { var b=null if (window.XMLHttpRequest) { b=new XMLHttpRequest() } else if (window.ActiveXObject) { b=new ActiveXObject("Microsoft.XMLHTTP") } return b } function GetXmlHttpObject() { var objXMLHttp=null if (window.XMLHttpRequest) { objXMLHttp=new XMLHttpRequest() } else if (window.ActiveXObject) { objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP") } return objXMLHttp } function change() { if (xy.readyState==4 || xy.readyState=="complete") { document.getElementById('alertmsg').innerHTML=xy.responseText document.getElementById('hintLYR').style.visibility = 'visible' } } var xy function check(obj) { var d = obj alert(d); switch(d){ case 'uname': var c = document.signupform.uname.value break; case 'fname': var c = document.signupform.fname.value break; case 'lname': var c = document.signupform.lname.value break; case 'pwd': var c = document.signupform.pwd.value break; case 'pwd2': var c = document.signupform.pwd2.value break; case 'email': var c = document.signupform.email.value break; case 'emailcon': var c = document.signupform.emailcon.value break; } alert(d + c) xy = GetXmlHttpObject() xy = GetXmlHttpObject() xy.onreadystatechange=change xy.open("GET","check.php?id="+c+"&obj="+d,true) xy.send(null) } var err = '<? echo $error ?>' function load() { if (err != '') { document.getElementById('alertmsg').innerHTML = unescape(a_[err]) document.getElementById('hintLYR').style.visibility = 'invisible' } } </script> I have another PHP file (check.php) that will run whenever 'onblur' is called. The form is not finished yet, but when I try to test it with FF and/or IE the 'onblur' event, especially on id='uname' input doesn't seem to work. What went wrong? Thank you. Stringx
