Question

我有以下javascript代码片段，它应该作为我的表单验证，以确保当用户提交表单时没有任何字段为空。代码适用于＆＃34; Detector_Type＆＃34 ;因为它的默认值是＆＃34;＆＃34;。

然而，当我将文字添加到下一个字段＆＃34; Name_and_Part_Number＆＃34;并尝试提交，该值仍显示为＆＃39; undefined＆＃39;在控制台日志中，即使我在文本字段中输入了文本。

为什么会发生这种情况，我该如何制作呢？当我输入文字时，它不再是未定义的？

编辑1：表单中存储的数据存储为RoR变量，可能会有所不同。

JS代码：

function validateForm(formId)

 var fields = ["Detector_Type", "Name_and_Part_Number", "Type", "FPA_Size", "Pitch"]
 var errors = ["Detector Type", "Name and Part Number", "Type", "FPA Size", "Pitch"]
  var i, l = fields.length;
  var fieldname; 
  for (i = 0; i < l; i++) {    
    fieldname = fields[i];
    console.log(fieldname + ": " + document.getElementById(fieldname).value);
    if ((document.getElementById(fieldname).value === "") || (typeof document.getElementById(fieldname).value === 'undefined'))) {
      alert(errors[i] + " can not be empty");
      return false;
    }

  }
  return true;
 }  
}

HTML代码：

...
<div class="field">
    <%= f.label :Detector_Type %><br>
  <select class="flat-text" style="width: 240px;" name='spreadsheet[Detector_Type]'     id='Detector_Type' onclick="toggle_visibility('Detector_Type');" >
      <option value=''>Choose a category...</option>
      <option value="GMAPD">GMAPD</option>
      <option value="DFPA">DFPA</option>
      <option value="Other">Other </option>  
   </select> 

  </div>   

  <div class="field" id="Name_and_Part_Number">
    <%= f.label :Name_and_Part_Number %><br>
    <%= f.text_field :Name_and_Part_Number%>
  </div>
  <div class="field" id= "Type">
    <%= f.label :Type %><br>
    <%= f.text_field :Type %>
  </div>
  <div class="field" id= "FPA_Size">
    <%= f.label :FPA_Size %><br>
    <%= f.text_field :FPA_Size %>
  </div>
  <div class="field" id= "Pitch">
    <%= f.label :Pitch %><br>
    <%= f.text_field :Pitch %>
  </div>
...

Answer 1

字段是DIV，要访问HTML元素的文本值，您可以使用与值相反的 innerHTML 属性。

Answer 2

如果要确保每个text_field都不为空，则需要检查字段而不是div。你可以在你的javascript中添加一个子选择器。

类似

$('#id input').first().val()

会获得该div下的输入，然后是它的值。

如果表单需要所有字段，那么您可以只为所有输入使用选择器，然后循环遍历它们，而不是循环遍历ID的静态列表。

Answer 3

仅使用rails：require =＆gt;没有自定义错误消息的真实验证

用户更改输入后，表单字段仍未定义

3 个答案: