動態創建的文本框上的javascript驗證

Question

在表單中，通過單擊“添加”按鈕動態創建文本框，以便在新行中創建文本框。現在我的問題是動態創建的文本框的驗證，以便在任何文本框中顯示消息通過單擊提交按鈕提交表單時保留為空。請幫助我。

編輯

  <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>

以上是在新行中添加新文本框的腳本。 現在我要求在單擊提交按鈕時，應在客戶端驗證每個文本框是否為空。 文本框中輸入的值不應消失，空文本框的數量應相同。

Answer 1

在表單的提交事件中，您只需收集在表單中找到的所有輸入文本框並將其傳遞給驗證函數。

將此代碼放在頁面的<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);
         }
}

並在<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