Brian Webster
Brian Webster

Reputation: 30865

ASP.NET - Can I handle the "ASP.NET client-side validation has succeeded" event in javascript?

I have a product page with an add to cart button

When the add to cart button is clicked, a couple of input fields are validated using ASP.NET validation controls (which use client-side validation to prevent the postback from occurring upon invalid input).

In order to prevent double-clicks from adding multiple items to the cart, I would like to disable the add to cart button after the initial click, but ONLY if validation has succeeded. (It would be rather bad to disable "add to cart" just because they goofed up an input)

Is it possible to handle the "on ASP.NET client-side validation succeeded" event in javascript?

I may just end up rolling my own validation mechanism for this page.

Upvotes: 4

Views: 1688

Answers (2)

planetClaire
planetClaire

Reputation: 446

Building on rick schott's answer to hide the button once validation succeeds, & reshow the button if the user hits escape:

<asp:Button ID="btnProcess" runat="server" Text="Donate" OnClick="BtnProcessClick" ValidationGroup="donate" ClientIDMode="Static" onClientClick="HideBtnProcess()">

<div id="pWait" >Please wait...</div>

<script type="text/javascript">
$(document).ready(function() {
    $("#pWait").hide();
});

function HideBtnProcess() {
    if (Page_ClientValidate("donate")) {
        $("#btnProcess").hide();
        $("#pWait").show();
        $(document).keyup(function (event) {
            if (event.which === 27) {
                $("#btnProcess").show();
                $("#pWait").hide();
            }
        });
    }
}

Upvotes: 1

rick schott
rick schott

Reputation: 21127

Just an example, but you can adopt this to your needs:

Markup:

<asp:button id="bla" runat="server" Text="bla" onClientClick="ValidationCatcher()" />

Script:

function ValidationCatcher()
{
    //force .net validation
    Page_ClientValidate();

    for(i=0; i < Page_Validators.length; i++)
    {
        if(!Page_Validators[i].isvalid)
        {
            //do whatever you need to do
        }
    }     
}

Upvotes: 2

Related Questions