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

时间:2011-08-01 10:33:48

标签: javascript asp.net onclientclick validation-controls

我在页面上有几个ASP文本框控件,添加了自定义验证器。我有保存按钮,它验证这些文本框。我刚刚将验证组添加到与文本框相同的位置。

为了合并addtional要求,我为Save按钮添加了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的解决方案并点击Save按钮的验证控件。

4 个答案:

答案 0 :(得分:7)

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

答案 1 :(得分:2)

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

function isValidTracker() {

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

    }

其中Page_IsValid是ASP.Net验证控件设置的Java脚本变量。成功验证所有验证控件后,它将设置为true。谢谢:))

答案 2 :(得分:1)

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团队的疏忽 - 你的实现似乎更直观,应该得到支持。

答案 3 :(得分:0)

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