如何将自定义 Javascript 添加到 asp.net 客户端导致验证功能？答案

【问题标题】：How do I add custom Javascript to asp.net client side causes validation function?如何将自定义 Javascript 添加到 asp.net 客户端导致验证功能？
【发布时间】：2011-03-29 14:13:32
【问题描述】：

我有一个带有一些验证控件的 asp.net 网络：

<div class="form-row">
     <label>Email</label>
            <asp:TextBox ID="txtUserName1" runat="server" onchange="validate(this)">    </asp:TextBox>
            <asp:RequiredFieldValidator ID="reqUserName1" runat="server" ControlToValidate="txtUserName1"
                ErrorMessage="- The email address field is required" Text="*" CssClass="error_star" Width="10px" ValidationGroup="Register"></asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator2" CssClass="error_star" runat="server" ErrorMessage="- Invalid Email Address" Text="*"
                        ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" ControlToValidate="txtUserName1"
                        ValidationGroup="Register"></asp:RegularExpressionValidator> 
        </div>

我有一个提交表单的按钮

<asp:Button ID="cmdSubmit" runat="server" Text="Create Account" CssClass="small-button"
            ValidationGroup="Register" CausesValidation="true" OnClientClick="validateForm()" OnClick="cmdSubmit_Click" />

我第一次点击按钮时，会运行一些客户端验证，但我的 validateForm() 方法没有被点击。随后我单击提交按钮，我的自定义验证工作正常。

如何将一些自定义 JavaScript 附加到客户端验证？

这里是javascript

function validateForm() {
        $("input[type=text], input[type=password]", "#registerForm").each(function () {
            validate(this)
        });
    }

    function validate(control) {
        // Change the colour of the border
        for (var i = 0; i < control.Validators.length; i++) {
            if (!control.Validators[i].isvalid) {
                control.style.border = "1px solid red"
                return;
            }
        }
        control.style.border = "1px solid #E1D7CE"

    }

【问题讨论】：

标签： asp.net validation client-side-validation

【解决方案1】：

页面没有验证，所以 javascript 正在工作，但它认为所有控件都有效，我添加了这个

if (!Page_ClientValidate("Register")) {
            Page_ClientValidate("Register")
        }

验证页面。

【讨论】：

【解决方案2】：

您可以使用自定义验证器

http://asp.net-tutorials.com/validation/custom-validator/

它们的工作方式与任何其他 asp.net 验证器一样，接受您编写处理验证并设置 IsValid 标志的函数。这反过来将允许/防止回发发生。

【讨论】：

我正在努力让这些工作，cmets here 并不是很鼓舞人心！

【解决方案3】：

1- 使用 CustomValidator，因此您所有的验证逻辑都将驻留在您的 JavaScript 代码中，假设您要验证文本框的数字 > 12，javascript 代码如下：

     function Validate(src, eventargs)
        {
          var control = Document.GetElementByID(src);
          if(control.value > 12)
           eventargs.IsValid = true;

    else 
    eventargs.IsValid = false;


        }

2- 使用 CustomValidator 的 ClientValidationFunctionProperty 设置为 ="Validate"（JavaScript 函数）

当您尝试执行任何回发时，会评估 Page.Validators 集合，因此您的 CustomValidator

【讨论】：

当将自定义验证器与所需验证器结合使用时，javascript 函数没有启动。我无法让它工作。此外，我在页面上已经有 7 个控件，每个控件有 1-3 个验证器，验证按要求工作，我只想将文本框边框变为红色。我是否需要替换所有验证控件并为每个控件编写新的 js 函数？希望我使用的是 MVC！
用它来标记无效的文本框与边框函数 MarkRequiredFields() { var validator = document.getElementById(''); var control = document.getElementById(validator.controltovalidate); if (!validator.IsValid) control.style.border = "3px solid Red"; }