动态创建的文本框上的javascript验证

Question

In a form a text box is created dynamically by clicking on add button such that the text box is created in a new row.Now my problem is the validation of text boxes which were created dynamically such that it shows a message if any of text boxes are left empty when form is submitted by clicking submit button.Please help me out. 在表单中，通过单击“添加”按钮动态创建文本框，以便在新行中创建文本框。现在我的问题是动态创建的文本框的验证，以便在任何文本框中显示消息通过单击提交按钮提交表单时保留为空。请帮助我。

EDIT 编辑

  <html>
   <head>

  <SCRIPT language="javascript">
   function addRow(tableID) {

    var table = document.getElementById(tableID);

    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);

    var cell1 = row.insertCell(0);
    var element1 = document.createElement("input");
    element1.type = "text";
    cell1.appendChild(element1);
 }

   </SCRIPT>
   </head>


   <body>


    <form onSubmit="return validateFormOnSubmit(this)">
   <INPUT type="button" value="Add More Symptom " onClick="addRow('dataTable')" />


    <TABLE id="dataTable" >
      <TR>

        <TD > 
          <INPUT type="text" name="symp[]" /> 
         </TD>
       </TR>
    </TABLE>
   <input type="submit" value="Submit" name="ADD_SUBMIT">
   </form>


  </body>    
  </html>

Above is the script to add new textboxes in a new row. 以上是在新行中添加新文本框的脚本。 Now i require that when submit button is clicked, each text boxes should be validated whether it is empty or not on client side. 现在我要求在单击提交按钮时，应在客户端验证每个文本框是否为空。 The entered values in the text box should not disappear and number of empty text boxes should be same. 文本框中输入的值不应消失，空文本框的数量应相同。

Answer 1

on the submit event of the form you simply need to collect all input text boxes that you find in the form and pass them into a validation function. 在表单的提交事件中，您只需收集在表单中找到的所有输入文本框并将其传递给验证函数。

Put this code in the <head> section of your page 将此代码放在页面的<head>部分

//This function here is only a cross-browser events stopper
stopEvent = function(ffevent)
{
   var current_window = window;

   if(current_window.event) //window.event is IE, ffevent is FF
   {
      //IE
      current_window.event.cancelBubble = true; //this stops event propagation
      current_window.event.returnValue = false; //this prevents default (usually is what we want)
   }
   else
   {
      //Firefox
      ffevent.stopPropagation();
      ffevent.preventDefault();
   };
}

function validateAllInputBoxes(ffevent)
{
   var inputs = document.getElementsByTagName('input');
   for(var i = 0; i < inputs.length; ++i)
      if(inputs[i].type === 'text')
         //@Satish, maybe below you wrote by mistake if(inputs[i].value = '') thus all input elements values get cleared out.
         if(inputs[i].value === '') 
         {
            alert("form could not be sent one input text field is empty");
            stopEvent(ffevent);
         }
}

and in the the <form> tag place the following code: 并在<form>标记中放置以下代码：

onsubmit="validateAllInputBoxes(event);"

动态创建的文本框上的javascript验证

问题描述

1 个解决方案

解决方案1
3 已采纳 2010-06-21 18:59:15

动态创建的文本框上的javascript验证

问题描述

1 个解决方案

解决方案1 3 已采纳 2010-06-21 18:59:15

解决方案1
3 已采纳 2010-06-21 18:59:15