Javascript 如果控件未填充,则自定义验证器不会触发

Javascript 如果控件未填充,则自定义验证器不会触发,javascript,c#,asp.net,validation,Javascript,C#,Asp.net,Validation,我有一种感觉,这可能是一个非常简单的问题,但我一生都无法解决它 我有一个asp:textbox。我有一个自定义的验证器,上面有客户端和服务器端验证 代码如下: <asp:TextBox ID="txtFirstName" runat="server"></asp:TextBox> <asp:CustomValidator ID="vldFirstName" runat="server" ControlToValidate="txtFirstName" Cl

我有一种感觉,这可能是一个非常简单的问题,但我一生都无法解决它

我有一个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>

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

但是,使用客户端验证。如果我走进盒子,直接从盒子里出来,没有输入任何东西。javascript验证不会启动。如果我输入一些东西。离开这个盒子。返回,然后清除验证工作的方框。它回来说它是空的


然而,我希望它在他们进入盒子并离开后立即进行验证。如果文本框未被触动,我不知道为什么验证器没有启动

我使用随机客户端验证测试了该代码,但验证没有正确启动

我添加了无障碍元素:

  • 页面加载时:(或以您希望的方式激活)

  • 确保已加载jquery:

  • 在global.asax上:

     protected void Application_Start(object sender, EventArgs e)
            {
                ScriptManager.ScriptResourceMapping.AddDefinition("jquery",
                new ScriptResourceDefinition
            {
              Path = "~/scripts/jquery-2.1.4.min.js",
              DebugPath = "~/scripts/jquery-2.1.4.js",
              CdnPath = "http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.0.min.js",
              CdnDebugPath = "http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.0.js"
            });
            }
    
    在这两个更新后(我有一个提交btn),它工作得很好

    因此,检查是否加载了无障碍验证,以及是否加载了您的jquery。

    您必须调用

    如果(第页有效)

    在服务器上回发时,否则将不会调用服务器验证。RequiredFieldValidator在客户机上进行验证,这就是此验证程序工作的原因。但是,您也应该始终在服务器上进行验证

    对于客户端验证,您必须编写一个JavaScript方法来执行同样的操作。在CustomValidator中设置属性:

    ClientValidationFunction=“YourValidationMethod”

    这个方法是这样做的

    function YourValidationMethod(source, args)
    {
    
       if (valid) // do check here
         args.IsValid = true;
      else
         args.IsValid = false;
    }
    

    我相信CustomValidator在设计上与RequiredFieldValidator是分开的,它们不在空字段上启动是正常的。

    啊,asp.net webforms的乐趣:)

    如果您正在使用其他控件,例如随jquery自带版本的radControls,这可能是一个问题,请确保通过禁用它们的控件来使用框架附带的控件

    或者,您可以在web.config中关闭不引人注目的验证,并查看它是否会在为空时触发

     <appSettings>
      <add key="ValidationSettings:UnobtrusiveValidationMode" value="None" />
    </appSettings>
    

    根据msdn文档……我对validateEmptyText=true属性的理解是,即使textbox为空,它也会触发自定义验证(validateName javascipt函数)

    第一次加载时可能处于启用状态该文本框的值未定义,但当您编辑并撤消该文本框时,该文本框的值现在将为空。(未定义),这就是为什么当您编辑并撤消但不是第一次加载时,该文本框会激发

    一种方法是在窗体的加载事件中使用空字符串初始化textbox值


    但我认为您可以通过将必填字段验证器与自定义验证器结合使用来解决您的问题,这是一种更好的方法。

    将下面的脚本放在Web表单中的任何位置,它将以您想要的方式工作:

    document.addEventListener('DOMContentLoaded', function() {
      [].forEach.call(document.querySelectorAll('input'), function(el, i) {
        el.addEventListener('blur', ValidatorOnChange);
      });
    });
    
    验证器不能以您想要的方式在本地工作,因为它在文本框中附加了一个
    onchange
    事件处理程序,因此,如果您根本不更改文本,就不会得到验证

    但是,如果您强制所有文本框触发相同的事件
    onblur
    ,那么,无论您是否更改了文本,它都将触发验证,这就是上面的脚本所做的:将该事件处理程序添加到页面中的所有文本框中,并在发生时调用
    ValidatorOnChange
    函数


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

    查看
    验证名称
    代码可能会有所帮助。@stuartd,验证代码目前很简单,检查长度是否大于3且值不为null。我已经对它进行了调试,每次代码被称为客户端时都会设置一个断点。当我放入某个内容并将其删除时,效果很好。但是如果刚刚跳过,
    ValidateName
    说明输入值是什么时候跳过的,什么时候放入/删除的,验证函数是否确实在
    ValidateName
    上定义了正确的函数参数(发送方,参数)?您需要更改UnobstrusiveEvalidationMode的应用程序设置吗?@Sam我已经测试了您的代码,在我的测试应用程序中一切正常。如果您可以与我们共享validateName代码会更好,可能是该代码或任何其他相关控件中存在错误导致了此问题。如果我发回,服务器端的代码可以正常工作。如果文本框中从未包含任何内容,则客户端不会激发。是的,默认情况下,它不会激发空字段,但如果将ValidateEmptyText指定为true,则它应该激发仍然相同的everytimeNope。尝试添加必需的字段验证器,并尝试将值设置为
    String.Empty加载仍会执行相同的操作。除非在firstUsing framework版本中键入了某些内容,否则不会进行验证。试过了,没什么不同。创建了一个新项目。添加了一个带有自定义验证器的文本框,但它不会启动,除非输入了内容,然后失去焦点,然后我可以删除文本,它将正确启动
    
    document.addEventListener('DOMContentLoaded', function() {
      [].forEach.call(document.querySelectorAll('input'), function(el, i) {
        el.addEventListener('blur', ValidatorOnChange);
      });
    });