2013-02-11 74 views
0

無法使用javascript方法中的提交方法提交表單& onclick事件
對按鈕元素甚至嘗試使用表單標記中的onsubmit事件。 需要不提交細節的原因。您可以複製代碼&運行它更多 清晰度。無法使用javascript方法中的submit()提交表單

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
    <head> 
    <script type="text/javascript">`enter code here` 
     function validateForm(form) { 
      if (validateNames(form['hallticket'], form['hallticket_help']) && validateNames(form['firstname'], form['firstname_help'])) { 
       form.submit();// Form is not getting submit 
      } 
      else { 
       alert("Please Enter the Required Fields"); 

      } 
     } 

     function validateNonEmpty(inputField, helpText) { 
      return validateRegex(/.+/, inputField.value, helpText, "please Enter a value"); 
     } 

     function validateRegex(regex, input, helpText, helpMessage) { 
      if (!regex.test(input)) { 
       //Data is mismatched 
       if (helpText != null) { 
        helpText.innerHTML = helpMessage; 
        return false; 
       } 
      } 
      else { 
       if (helpText != null) 
       //data is matched 
        helpText.innerHTML = ""; 
       return true; 
      } 
     } 

     function validateHallticket(inputField, helpText) { 
      if (!validateNonEmpty(inputField, helpText)) { 
       return false; 
      } 
      else 
       return validateRegex(/^\d{2}K91A\d{4}$/, inputField.value, helpText, "Enter valid Hallticket"); 
     } 

     function validateNames(inputField, helpText) { 
      // see that input data is non empty 
      if (!validateNonEmpty(inputField, helpText)) { 
       return false; 
      } 
      else 
       return validateRegex(/.+/, inputField.value, helpText, "Please Enter only Alphabets"); 
     } 
    </script> 
    <link rel="StyleSheet" href="test1.css" type="text/css"></link> 
    </head> 
    <body> 
    <center> 
     <font face="Arabic Transparent" size="6" color="Teal">4cUBeS College</font> 
    </center> 

    <br></br> 

    <br></br> 

    <form method="post" action="servlet.do" name="myform"> 
     <table border="1"> 
     <tr> 
      <td> 
      HallTicket: 
      <input type="text" name="hallticket" id="hallticket" 
        onblur="validateHallticket(this,document.getElementById('hallticket_help'))"></input> 

      <span id="hallticket_help" class="helpcss"> </span> 
      </td> 
     </tr> 

     <tr> 
      <td> 
      FirstName: 
      <input type="text" name="firstname" id="firstname" 
        onblur="validateNames(this,document.getElementById('firstname_help'))"></input> 

      <span id="firstname_help" class="helpcss"> </span> 
      </td> 
      <td> 
      LastName: 
      <input type="text" name="lastname" id="lastname" 
        onblur="validateNames(this,document.getElementById('lastname_help'))"></input> 

      <span id="lastname_help" class="helpcss"> </span> 
      </td> 
     </tr> 
     </table> 
     <center> 
     <input type="button" value="SUBMIT" onclick="validatForm(this.form)"></input> 
     </center> 
    </form> 
    </body> 
</html> 
+0

'的onclick = 「validatForm」'注意從函數名失蹤'e'。 – marekful 2013-02-11 12:58:56

+0

表單中的跨度不是表單對象。 – mplungjan 2013-02-11 13:05:33

+0

更正了功能名稱,但沒有起作用@MarcellFülöp – user2042156 2013-02-11 13:08:26

回答

0

請檢查您的調用的onclick功能,它的拼寫錯誤爲 'validatForm' 而不是 'validateForm'

+0

KC感謝您指出雖然糾正沒有工作兄弟... – user2042156 2013-02-11 13:06:16

0

這修復了很多問題

DEMO

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
    <head> 
    <script type="text/javascript"> 
function validateNonEmpty(inputField, helpTextId) { 
    var helpText = document.getElementById(helpTextId); 
    return validateRegex(/.+/, inputField.value, helpText, "please Enter a value"); 
} 

function validateRegex(regex, input, helpText, helpMessage) { 
    if (regex.test(input)) { 
     if (helpText != null) { 
     helpText.innerHTML = ""; 
     }  
     return true; 
    } 
    //Data is mismatched 
    if (helpText != null) { 
    helpText.innerHTML = helpMessage; 
    }  
    return false; 
} 

function validateHallticket(inputField, helpText) { 
    if (!validateNonEmpty(inputField, helpText)) { 
    return false; 
    } 
    return validateRegex(/^\d{2}K91A\d{4}$/, inputField.value, helpText, "Enter valid Hallticket"); 
} 

function validateNames(inputField, helpText) { 
    // see that input data is non empty 
    if (!validateNonEmpty(inputField, helpText)) { 
    return false; 
    } 
    return validateRegex(/.+/, inputField.value, helpText, "Please Enter only Alphabets"); 
} 

window.onload=function() { 
    document.getElementById("myform").onsubmit=function() { 

    if (validateNames(this['hallticket'], 'hallticket_help') && 
     validateNames(this['firstname'], 'firstname_help') && 
     validateNames(this['lastname'], 'lastname_help')) { 
     return true; 
    } 

    alert("Please Enter the Required Fields"); 
    return false; // cancel submit 
    } 
} 
    </script> 
    <link rel="StyleSheet" href="test1.css" type="text/css"></link> 
    </head> 
    <body> 
    <center> 
     <font face="Arabic Transparent" size="6" color="Teal">4cUBeS College</font> 
    </center> 

    <br></br> 

    <br></br> 

    <form method="post" action="servlet.do" name="myform" id="myform"> 
     <table border="1"> 
     <tr> 
      <td> 
      HallTicket: 
      <input type="text" name="hallticket" id="hallticket" 
        onblur="validateHallticket(this,'hallticket_help')" /> 

      <span id="hallticket_help" class="helpcss"> </span> 
      </td> 
     </tr> 

     <tr> 
      <td> 
      FirstName: 
      <input type="text" name="firstname" id="firstname" 
        onblur="validateNames(this,'firstname_help')" /> 

      <span id="firstname_help" class="helpcss"> </span> 
      </td> 
      <td> 
      LastName: 
      <input type="text" name="lastname" id="lastname" 
        onblur="validateNames(this,'lastname_help')" /> 

      <span id="lastname_help" class="helpcss"> </span> 
      </td> 
     </tr> 
     </table> 
     <center> 
     <input type="submit" value="SUBMIT" /> 
     </center> 
    </form> 
    </body> 
</html> 
+0

這裏函數()是一個關鍵字? – user2042156 2013-02-11 13:14:27

+0

@mplungjian檢查...沒有工作... – user2042156 2013-02-11 13:17:13

+0

更新 - 請參閱演示 - 我使用匿名函數來驗證窗體 - 分配頁面的onload – mplungjan 2013-02-11 13:22:34

0

除了拼寫在你的代碼中已經發現的問題還有一個。 您的按鈕提交輸入的標籤是: <input type="button" value="SUBMIT" onclick="validatForm(this.form)"></input>

而且必須是: <input type="submit" value="SUBMIT" onclick="validateForm(this.form)"/>

相關問題