Question

我在asp.net上有一个表单，通过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());
                }
            }
        });

Answer 1

创建元素连接行号到class =“dynamicText”。（dynamicText + rownumber）。不要忘记增加变量。

在验证（或提交）时检查rownumber并迭代它rownumber次。当它在循环中迭代时，在循环中获取具有类“dynamicText”和rownumber的所有元素，因此您将获得具有类dynamicText1或dynamicText2等的元素......它将是元素数组。

然后在循环内检查文本框是否有任何值，则必须填写其他文本框。

动态添加表行的Javascript客户端验证

1 个答案: