2015-11-10 5 views
-1

Я искал 3 часа для этой ошибки, и я не могу на всю жизнь найти ее. Похоже, что onsubmit не вызван по какой-либо причине. Я пытаюсь убедиться, что пользователь вводит неотрицательное число в каждом полеформа onsubmit не работает

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
     <script type="text/javascript"> 
 
     function validate(){ 
 
       var wid1 = document.getElementByName("widget1").value; 
 
       var wid2 = document.getElementByName("widget2").value; 
 
       var wid3 = document.getElementByName("widget3").value; 
 
       if(isNaN(wid1)||isNaN(wid2)||isNaN(wid3)){ 
 
         alert("all values entered must be numbers"); 
 
         return false; 
 
       } 
 
       else if(wid1 < 0 || wid2 < 0 || wid3 < 0){ 
 
         alert("all values must be greater than zero"); 
 
         return false; 
 
       } 
 
       if(wid1+wid2+wid3 > 25){ 
 
         if(!confirm("you have more than 25 items. Will you accept the additional shipping?")){ 
 
           return false; 
 
         } 
 
       } 
 
       return true; 
 
     } 
 
     </script> 
 
</head> 
 
<body> 
 
     <form name="order" action="calculations.php" method="get" onsubmit="return validate()"> 
 
       <p>37AX-L:</p> 
 
       <input type="text" name="widget1" value="0" required/> 
 
       <br> 
 
       <p>42XR-J</p> 
 
       <input type="text" name="widget2" value="0" required/> 
 
       <br> 
 
       <p>93XX-A</p> 
 
       <input type="text" name="widget3" value="0" required/> 
 
       <br> 
 
       <input type="radio" name="State" value="MO" checked>Missouri</input> 
 
       <br> 
 
       <input type="radio" name="State" value="IL">Illinois</input> 
 
       <br> 
 
       <input type="submit" value="submit"/> 
 
     </form> 
 
</body> 
 
</html>

+0

привет в настоящее время используется для Thsi getElementByName заменить в getElementsByName –

+0

'getElementsByName' возвращает' NodeList'. Вам нужно проиндексировать его для доступа к значению. – Barmar

+0

Спасибо, ребята, так много! –

ответ

1

Во-первых, имя функции getElementsByName - Elements множественное число.

Во-вторых, поскольку это возвращает NodeList, вам необходимо проиндексировать результат для доступа к определенному элементу, чтобы вы могли получить доступ к его значению.

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
     <script type="text/javascript"> 
 
     function validate(){ 
 
       var wid1 = document.getElementsByName("widget1")[0].value; 
 
       var wid2 = document.getElementsByName("widget2")[0].value; 
 
       var wid3 = document.getElementsByName("widget3")[0].value; 
 
       if(isNaN(wid1)||isNaN(wid2)||isNaN(wid3)){ 
 
         alert("all values entered must be numbers"); 
 
         return false; 
 
       } 
 
       else if(wid1 < 0 || wid2 < 0 || wid3 < 0){ 
 
         alert("all values must be greater than zero"); 
 
         return false; 
 
       } 
 
       if(wid1+wid2+wid3 > 25){ 
 
         if(!confirm("you have more than 25 items. Will you accept the additional shipping?")){ 
 
           return false; 
 
         } 
 
       } 
 
       return true; 
 
     } 
 
     </script> 
 
</head> 
 
<body> 
 
     <form name="order" action="calculations.php" method="get" onsubmit="return validate()"> 
 
       <p>37AX-L:</p> 
 
       <input type="text" name="widget1" value="0" required/> 
 
       <br> 
 
       <p>42XR-J</p> 
 
       <input type="text" name="widget2" value="0" required/> 
 
       <br> 
 
       <p>93XX-A</p> 
 
       <input type="text" name="widget3" value="0" required/> 
 
       <br> 
 
       <input type="radio" name="State" value="MO" checked>Missouri</input> 
 
       <br> 
 
       <input type="radio" name="State" value="IL">Illinois</input> 
 
       <br> 
 
       <input type="submit" value="submit"/> 
 
     </form> 
 
</body> 
 
</html>

0

Вы можете сделать это, как этот

$('#submitIT').submit(function(e){ 
 
    console.log("callingIT"); 
 
    var wid1 = document.getElementById("widget1").value; 
 
       var wid2 = document.getElementById("widget2").value; 
 
       var wid3 = document.getElementById("widget3").value; 
 
       if(isNaN(wid1)||isNaN(wid2)||isNaN(wid3)){ 
 
         console.log("all values entered must be numbers"); 
 
         e.preventDefault(); 
 
       } 
 
       else if(wid1 < 0 || wid2 < 0 || wid3 < 0){ 
 
         console.log("all values must be greater than zero"); 
 
         e.preventDefault(); 
 
       } 
 
       if(wid1+wid2+wid3 > 25){ 
 
         if(!confirm("you have more than 25 items. Will you accept the additional shipping?")){ 
 
           e.preventDefault(); 
 
         } 
 
       } 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
     
 
</head> 
 
<body> 
 
     <form id="submitIT" name="order" action="calculations.php" method="get"> 
 
       <p>37AX-L:</p> 
 
       <input type="text" id="widget1" value="0" required/> 
 
       <br> 
 
       <p>42XR-J</p> 
 
       <input type="text" id="widget2" value="0" required/> 
 
       <br> 
 
       <p>93XX-A</p> 
 
       <input type="text" id="widget3" value="0" required/> 
 
       <br> 
 
       <input type="radio" id="State" value="MO" checked>Missouri</input> 
 
       <br> 
 
       <input type="radio" id="State" value="IL">Illinois</input> 
 
       <br> 
 
       <input type="submit" value="submit"/> 
 
     </form> 
 
</body> 
 
</html>

Смежные вопросы