javascript - 如果未填写控件，则自定义验证器不会触发

Question

我觉得这可能是一个非常简单的问题，但我一生都无法解决。

我有一个 asp:textbox。我有一个自定义验证器，上面有客户端和服务器端验证。

代码如下:

<asp:TextBox ID="txtFirstName" runat="server"></asp:TextBox>

<asp:CustomValidator ID="vldFirstName" runat="server" ControlToValidate="txtFirstName"
    ClientValidationFunction="ValidateName" OnServerValidate="vldFirstName_ServerValidate"
    Text="Please put in your first name" ErrorMessage="First name missing"
    ForeColor="Red" font-bold="true" Display="Dynamic"
    ValidateEmptyText="true">
</asp:CustomValidator>

如果我直接进入我的页面并单击提交，将文本框留空，这将在服务器端正确验证。

但是有客户端验证。如果我不输入任何内容就直接进入盒子并直接从盒子里出来。 javascript 验证不会触发。如果我再输入一些东西。离开方框。返回然后清除验证有效的框。它回来说它是空的。

但是我希望他们一进入盒子就让它进行验证。如果文本框未被触及，我不确定为什么验证器不触发。

Answer 1

将下面的脚本放在您的网络表单中的任何位置，它就会按照您想要的方式工作:

document.addEventListener('DOMContentLoaded', function() {
  [].forEach.call(document.querySelectorAll('input'), function(el, i) {
    el.addEventListener('blur', ValidatorOnChange);
  });
});

Validator 本身并没有按照您想要的方式工作，因为它将 onchange 事件处理程序附加到 TextBox，因此，如果您根本不更改文本，就不会获得验证。

但是如果你强制所有的TextBox触发同一个事件onblur，那么，不管你有没有改变文本，它都会触发验证，这就是上面的脚本所做的: 将该事件处理程序添加到页面中的所有文本框，并在它发生时调用 ValidatorOnChange 函数。

注意:如果您已经在应用程序中的每个 WebForm 中调用任何脚本，并且您希望此行为在任何地方都有效，您可以将代码添加到该脚本中(在它的任何地方)，解决方案将传播到您所有的网络表单。