Ajax Form Validation

programming web dev
1

OK, I have recently been trying to implement this form validation through ajax. i can get it to work here http://cyhite.com/test_ajax/test_123.html but not here: http://acc.cyhite.com/

Here is the code i put together from each page:

The one that works:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
 <head>
  <script src="prototype.js" type="text/javascript"></script>
  <script src="effects.js" type="text/javascript"></script>
 
  <script type="text/javascript" src="validation.js"></script>
  <link rel="stylesheet" type="text/css" href="style.css" />
 </head>
 <body>
 
 
 
     <form id="login" action="#" method="get">
 
      <div class="form-row">
       <div class="field-label">
         <label for="field1">ID</label>
         :</div>
       <div class="field-widget"><input name="field1" id="field1" class="required validate-number" title="Enter your name" /></div>
      </div>
      <div class="form-row">
       <div class="field-label">
         <label for="field3">Password</label>
       :</div>
       <div class="field-label"><input name="field3" type="password" class="required validate-alphanum" id="field3" title="Enter your employee number, please use only alphanumeric characters" />
       </div>
      </div>
 
     <input type="submit" value="Submit" /> <input type="button" value="Reset" onclick="valid.reset(); return false" />
     </form>
     <script type="text/javascript">
      function formCallback(result, form) {
       window.status = "valiation callback for form '" + form.id + "': result = " + result;
      }
 
      var valid = new Validation('login', {immediate : true, onFormValidate : formCallback});
     </script>
</body>
</html>

Here is the code that doesn’t work:


<html>
<head>
<title>Cyhite Inc.</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 
  <script src="prototype.js" type="text/javascript"></script>
  <script src="effects.js" type="text/javascript"></script>
  <script type="text/javascript" src="validation.js"></script>
  <link href="inc/main_login.css" rel="stylesheet" type="text/css">
 
 
</head>
<body>
<p></p>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td align='center' valign='middle'><table width="100%" border="0" cellpadding="4" cellspacing="0" bgcolor="#8B9AA1" class="login_tbl">
      <tr>
        <td class="title_gogo">Cyhite<strong> MyAccount</strong></td>
        <td>&nbsp;</td>
      </tr><tr>
        <td width="67%" valign='top'><span class="style7">Logging in:</span> 
          <ol>
          <li>Enter your username 
          (Employe ID or if client then client ID)<li>Enter your password
          <li>click the &quot;Sign In&quot; button.
          </ol>
          <p class="style7">After logging in you get the following tools:<ul>
            <li>Account management
            <li>Group management
            <li>Project Management (Project managers only.)
            <li>Profiles (To allow Project Managers choose the right person.)
            <li>Time Management
            <li>And much much more.                                                                  
          </ul>
          </p>          </td>
        <td width="33%">
  <p><form id="login" action="#" method="get">
 
      <div class="form-row">
       <div class="field-label">
         <label for="field1">ID</label>
         :</div>
       <div class="field-widget"><input name="field1" id="field1" class="required validate-number" title="Enter your name" /></div>
      </div>
      <div class="form-row">
       <div class="field-label">
         <label for="field3">Password</label>
       :</div>
       <div class="field-label"><input name="field3" type="password" class="required validate-alphanum" id="field3" title="Enter your employee number, please use only alphanumeric characters" />
       </div>
      </div>
 
 
     <input type="submit" value="Submit" /> <input name="Reset" type="reset" onclick="valid.reset(); return false" value="Reset" />
     </form>
     <script type="text/javascript">
      function formCallback(result, form) {
 
      var valid = new Validation('login', {immediate : true, onFormValidate : formCallback});
     </script></p>
        <p><a href="<A href="http://acc.cyhite.com/acc_fpass.php">Forgot">http://acc.cyhite.com/acc_fpass.php">Forgot your Username or Password?</a></p>
          <p>&nbsp;</p>
          <p>&nbsp;</p></td>
      </tr>
 
      <tr>
        <td class="btm_copyr">Cyhite MyAccount &copy; 2006 | Privacy Statement | <a href="<A href="http://acc.cyhite.com/docs/?doc=tos">Terms">http://acc.cyhite.com/docs/?doc=tos">Terms of Service</a> | </td>
        <td class="btm_copyr"><div align="right">Help</div></td>
      </tr>
    </table>
      </td>
  </tr>
</table>
</body>
</html>

If you have any ideas to what may be wrong, please let me know.