从按钮客户端单击上的验证控件触发 onclientclick 和客户端验证

Question

我的页面上有几个 ASP 文本框控件，其中添加了自定义验证器。我有保存按钮，它可以验证这些文本框。我刚刚添加了与文本框相同的验证组。

为了纳入额外的要求，我为“保存”按钮添加了 onClientClick 函数。但有趣的是发现由于验证组（验证器控件）而导致的验证没有触发，而是调用了 onClientClick 函数并调用了服务器端 Click 事件。

Javascript 代码

function ValidateInputs(source, args) {
            var regex = /^(-{0,1}\d{1,100})$/;
            if (args.Value.length < 1) {
                $("span[id$='spn_error']").html('Please Enter ' + $(source).attr("errormessage"));
                $("span[id$='spn_error']").show();
                args.IsValid = false;
                return;
            }
            else if (!regex.test(args.Value)) {
                $("span[id$='spn_error']").html($(source).attr("errormessage") + ' allows only numbers');
                $("span[id$='spn_error']").show();
                args.IsValid = false;
                return;
            }
            else {
                if ($("span[id$='spn_error']").html().indexOf($(source).attr("errormessage")) >= 0)
                    $("span[id$='spn_error']").hide();
                args.IsValid = true;
                return;
            }
        }

function isValidTracker() {
//Dummy Code Say Confirm button
return(confirm('Are you sure');)

}

HTML 代码

<span class="errormesg" runat="server" id="spn_error" style="display: none;
                        font-size: 9px;"></span>
<asp:TextBox ID="txtLastMonthCount" runat="server" CssClass="inputbox" Width="75px" autocomplete="off" onkeypress="return isNumberKey(event);" ValidationGroup="g1"></asp:TextBox>

<asp:CustomValidator ID="CVLastMonthCount" runat="server" ErrorMessage="Last Months Closing Count" Text="<img src='../images/alert.gif' alt='Please Enter Last Months Closing Count' title='Please Enter Last Months Closing Count' />" 
    ValidationGroup="g1" ClientValidationFunction="ValidateInputs" OnServerValidate="ValidateInputs" ControlToValidate="txtLastMonthCount" ValidateEmptyText="true"></asp:CustomValidator>

<asp:Button ID="btnSave" runat="server" Text="Save" CssClass="button" ValidationGroup="g1" OnClientClick="return isValidTracker();" OnClick="btnSave_Click" />

请帮助我找到触发 onclientclick 和保存按钮单击验证控制的解决方案。

Answer 1

将 OnClientClick 从 return isValidTracker() 更改为 if (!isValidTracker()) return false;

Answer 2

感谢您提供的解决方案。我在谷歌搜索时也得到了一个解决方案，想分享它，因为这对于像我这样的其他人来说在各种其他场景中都会有所帮助。

function isValidTracker() {

    if (Page_IsValid) {
        return(confirm('Are you sure');)//Dummy Code Say Confirm button
    }
    else
    {
        return false;
    }

    }

其中 Page_IsValid 是 ASP.Net 验证控件设置的 Java 脚本变量。当所有验证控件均已成功验证时，它设置为 true。谢谢 ：）

Answer 3

OneHalf 的解决方案有效，但我会将最终检查烘焙到您的验证器中 - 这确保您不会询问用户“您确定吗？”直到您知道他们的操作是有效的...

    function ValidateInputs(source, args) {
    var regex = /^(-{0,1}\d{1,100})$/;
    if (args.Value.length < 1) {                 
        $("span[id$='spn_error']").html('Please Enter ' + $(source).attr("errormessage"));
        $("span[id$='spn_error']").show();                 
        args.IsValid = false;                 
    }             
    else if (!regex.test(args.Value)) {                 
        $("span[id$='spn_error']").html($(source).attr("errormessage") + ' allows only numbers');                
        $("span[id$='spn_error']").show();                 
        args.IsValid = false;                
    } else {                 
        if ($("span[id$='spn_error']").html().indexOf($(source).attr("errormessage")) >= 0)                     
            $("span[id$='spn_error']").hide();                 
        args.IsValid = true;
    }

    if (args.IsValid) args.IsValid = isValidTracker();
}  

尽管我同意 ASP.NET 团队存在疏忽，但您的实现似乎更直观并且应该得到支持。

乙

Answer 4

您好我也面临同样的问题。
CausesValidation="true" 属性解决了我的问题。