フォームデータを確認するJavascriptが機能しない

Question

フォームデータをチェックするためのコードがあり、その理由がわかりません。

<script type="text/javascript"> 
      function checkStuff() { 
       // By default, we plan to submit the form. 
       var formOkay = 1; 

       // Check to see if field_1 has a value. If not, we note that by changing our variable. 
       if(document.getElementById('requestorfirstname').value == '') 
        formOkay = 0; 

       // Let the user know something is wrong somehow. An alert is easiest. 
       alert('Requestor Name Required!'); 

       // If you return true the form will submit. If you return false it will not. 
       if(formOkay == 1) { 
        return true; 
       } else { 
        return false; 
       } 
      } 
     </script> 

ここでは、htmlフォームのチェックがオンになっています。

<input type="text" name="requestorfirstname" /> 

ありがとうございます！

Answer 1

document.getElementByIdはIDによって要素を探します。あなたのフィールドはIDを持っていません、それはNAMEを持っています。

Answer 2

document.getElementByIdは、nameではなく、idで要素を選択します。

問題を解決するためにいくつかの方法：

• は、入力要素にid="requestorfirstname"を追加します。
• を使用してください。 getElementsByNameはリストを返します。したがって、[0]です。
• document.querySelector('[name="requestorfirstname"]')メソッドを使用します。

• フォームへの参照を取得し、.elementsコレクションを使用して要素にアクセスします。あなたのページには、一つだけのフォームを持っている場合
  はたとえば、：

  document.forms[0].elements['requestorfirstname'] 
  

Answer 3

name HTML要素の属性は、idと同じではありません。あなたは入力フィールドにIDがないので、getElementByIdがそれを見つける方法はありません。要素を

<input type="text" name="requestorfirstname" id="requestorfirstname" /> 
              ^^^^^^^^^^^^^^^^^^^^^^^^ - add this