2015-11-11 67 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的东西,但我想我没有。 >< –