動態添加的表格行的Javascript客戶端驗證

我有一個asp.net上的窗體，動態創建表格行上的按鈕點擊使用JavaScript。我遇到的問題是這些動態表格行是可選的，以便用戶填寫，以便在提交表單時填充或留空。動態添加的表格行的Javascript客戶端驗證

什麼是根據用戶的輸入檢查驗證的好方法，所以如果用戶在動態添加的表格行的一個文本框中輸入某些內容，那麼這意味着其他文本框需要驗證，因此不應允許用戶提交表格。

的Javascript：

$btnAddTableRow.click(function() { 
      var html = '<tr>' + 
       '<td><input type="text" class="dynamicText" id="txtName' + 
       idCounter + 
       '"/></td>' + 
       '<td><input type="text" class="dynamicText" id="txtEmail' + 
       idCounter + 
       '"/></td>' + 
       '</tr>'; 

      $($tblMembers).append(html); 
      idCounter++; 
     });

所以你可以在代碼中看到，每個按鈕點擊將增加2個文本框的姓名和電子郵件哪些是可選的一個新錶行供用戶填寫的唯一途徑我現在可以想到的是做一個if else語句來檢查每個盒子，但看起來效率很低。我的驗證會像在文本框周圍放置一個紅色邊框，如果用戶提交表單時沒有填充其中一個文本框（如果已經填寫了另一個文本框），則需要填充該文本框。

謝謝！

編輯：

$('#showCounter').click(function() { 
      for (var i = 1; i < idCounter; i++) { 
       if ($('[id$="txtName' + i + '"]').val() !== "" || $('[id$="txtName' + i + '"]').val() !== null) { 
        console.log($('[id$="txtName' + i + '"]').val()); 
       } 
      } 
     });

來源

2017-08-21 SC.Cee

在創建元件concate行號類= 「dynamicText」（dynamicText + ROWNUMBER）。不要忘記增加變量。

在驗證（或提交）檢查rownumber並重復它rownumber次。雖然它在循環中迭代獲取循環中類「dynamicText」和rownumber的所有元素，所以您將獲得具有類dynamicText1或dynamicText2等的元素......它將是元素數組。

然後在循環內檢查任何文本框是否有值，然後其他文本框必須填寫。

來源

2017-08-21 17:06:19 IOTEnthu

感謝這解決了它。 –

動態添加的表格行的Javascript客戶端驗證

回答

相關問題