2015-11-11 101 views
1

我在嘗試使用Javascript驗證整個表單時遇到了問題。使用Javascript驗證表單

「添加JavaScript代碼以產生錯誤消息,並且如果任何數量字段包含非數字數據,則會禁止提交表單(數量爲空即可,但如果數量不爲空,則必須只有)將一個action = attribute添加到您的標籤中,以將該表單提交給網站(不打算放入實際的網站)。測試當數量爲數字或空白時正確提交表單,否則產生錯誤消息「。

我已經完成了所有的指示要求我做,它不工作。我們應該使用我們在之前的實驗室中創建的表單。這是我一直在努力的代碼。

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Lab 6, Part 3</title> 
     <meta charset="UTF-8"/> 
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> 
     <script type="text/javascript"> 
     function validateForm(){ 
      var a = document.forms["myform"]["Pokemon"].value; 
      var b = document.forms["myform"]["Pokeball"].value; 
      var c = document.forms["myform"]["Pikachu"].value; 
      var d = document.forms["myform"]["firstname"].value; 
      var e = document.forms["myform"]["lastname"].value; 
      var f = document.forms["myform"]["streetaddress"].value; 
      var g = document.forms["myform"]["city"].value; 
      var h = document.forms["myform"]["zipcode"].value; 

      if (a = null || a == ""){ 
       alert("Grapes must be filled out!"); 
       return false; 
      } 

      if (b = null || b == ""){ 
       alert("Cherries must be filled out!"); 
       return false; 
      } 

      if (c = null || c == ""){ 
       alert("Strawberries must be filled out!"); 
       return false; 
      } 

      if (d = null || d == ""){ 
       alert("First Name must be filled out!"); 
       return false; 
      } 

      if (e = null || e == ""){ 
       alert("Last Name must be filled out!"); 
       return false; 
      } 

      if (f = null || f == ""){ 
       alert("Street Address must be filled out!"); 
       return false; 
      } 

      if (g = null || g == ""){ 
       alert("City must be filled out!"); 
       return false; 
      } 

      if (h = null || h == ""){ 
       alert("Zip Code must be filled out!"); 
       return false; 
      } 


     } 
     </script> 
    </head> 
    <body><form> 
     <form name="myform" action="http://weblab.kennesaw.edu/formtest.php" 
    onsubmit="return validateForm()" 
       method = "post"> 
     <h1 style="text-align:center">Lab 6, Part 3</h1> 
     <h2 style="text-align:center">IT 3203</h2> 
     <a href="index.html"><p style="text-align:center">Main Page!</p></a> 
      <p>Grapes</p><input type=text size=3 maxlength=3 name="Pokemon"> 
      <p>Cherries</p><input type=text size=3 maxlength=3 name="Pokeball"> 
      <p>Strawberries</p><input type=text size=3 maxlength=3 name="Pikachu"> 
     <br> 
     <label>First Name 
      <input type="text" 
        name="firstname" id="firstname" 
        size="25" /> 
     </label> 
     <br> 
     <br> 
     <label>Last Name 
      <input type="text" 
        name="lastname" id="lastname" 
        size="25" /> 
     </label> 
     <br> 
     <br> 
     <label>Street Address 
      <input type="text" 
        name="streetaddress" id="streetaddress" 
        size="35" /> 
     </label> 
     <br> 
     <br> 
     <label>City 
      <input type="text" 
        name="city" id="city" 
        size="25" /> 
     </label> 
     <label>State: 
      <select name="state"> 
       <option>Please Select</option> 
       <option>Alabama</option> 
       <option>Alaska</option> 
       <option>Arizona</option> 
       <option>Arkansas</option> 
       <option>California</option> 
       <option>Colorado</option> 
       <option>Connecticut</option> 
       <option>Delaware</option> 
       <option>Florida</option> 
       <option>Georgia</option> 
       <option>Hawaii</option> 
       <option>Idaho</option> 
       <option>Illinois</option> 
       <option>Indiana</option> 
       <option>Iowa</option> 
       <option>Kansas</option> 
       <option>Kentucky</option> 
       <option>Louisiana</option> 
       <option>Maine</option> 
       <option>Maryland</option> 
       <option>Massachusetts</option> 
       <option>Michigan</option> 
       <option>Minnesota</option> 
       <option>Mississippi</option> 
       <option>Missouri</option> 
       <option>Montana</option> 
       <option>Nebraska</option> 
       <option>Nevada</option> 
       <option>New Hampshire</option> 
       <option>New Jersey</option> 
       <option>New Mexico</option> 
       <option>New York</option> 
       <option>North Carolina</option> 
       <option>North Dakota</option> 
       <option>Ohio</option> 
       <option>Oklahoma</option> 
       <option>Oregon</option> 
       <option>Pennsylvania</option> 
       <option>Rhode Island</option> 
       <option>South Carolina</option> 
       <option>South Dakota</option> 
       <option>Tennessee</option> 
       <option>Texas</option> 
       <option>Utah</option> 
       <option>Vermont</option> 
       <option>Virginia</option> 
       <option>Washington</option> 
       <option>West Virginia</option> 
       <option>Wisconsin</option> 
       <option>Wyoming</option> 
      </select> 
     </label> 
     <br> 
     <br> 
     <label>Zip code: 
      <input type="text" 
        name="zipcode" id="zipcode" 
        size="20" /> 

     </label> 
     </form> 
     <br> 
     <br> 
     <label>Visa 
      <input type="radio" name="pref_payment" 
        id="pref_payment_visa" value="visa" checked /> 
     </label><br /> 
     <label>MasterCard 
      <input type="radio" name="pref_payment" 
        id="pref_payment_master" value="master" checked /> 
     </label><br /> 
     <label>American Express 
      <input type="radio" name="pref_payment" 
        id="pref_payment_american" value="american" checked /> 
     </label><br /> 
     <input type="button" onclick="confirmation()" value="submit"> 
     </form> 
    </body> 
</html> 

這可能是一些小事,我忽略了一些東西。哦,我們必須將這些文件保存在.php文件中,所以這可能與它有很大關係。

+0

什麼並不完全工作?表單不提交?你在開發控制檯中看到任何錯誤嗎? – Terminus

+0

爲什麼你的選項沒有「價值」? – Terminus

+0

否表單不提交。你認爲有價值的期權是什麼意思? –

回答

1

1)檢查你的表單標籤。你有兩個。

<form> 

2)您的提交按鈕類型。

應該是:

type="submit" 

不:

type="button" 

而且無需添加:

onclick="confirmation()" 

http://plnkr.co/edit/Ml2KWgfU5KG5gmBpf8Fe?p=preview

+0

O.O omg。謝謝。我很慢。現在它工作得很好。我以爲我擺脫了onclick的東西,但我想我沒有。 >< –