how to make client side validation work along with this.disabled=true and __dopostback.

Last post 03-07-2008 2:45 PM by NC01. 5 replies.

Sort Posts:

  • how to make client side validation work along with this.disabled=true and __dopostback.

    03-07-2008, 1:34 AM
    • Loading...
    • bins
    • Joined on 03-07-2008, 6:22 AM
    • Posts 3

    Hello team,

    I need an urgent help on this one. Thought it was a common scenario, but couldn’t find a solution till now Indifferent, On my web application, I have 2 update panels on a page having 1 submit button each. ‘Enter’ key was creating issues on firefox, this was fixed using the following code. (thanks to asp.net forum).

    (have created a new page with only the relevant code to make it easier to understand)
    Aspx

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <
    html xmlns="http://www.w3.org/1999/xhtml" >
    <
    head runat="server">
       
    <title>Untitled Page</title>
    </
    head>

    <body>
        <form id="form1" runat="server">
           
    <asp:ScriptManager ID="ScriptManager1" runat="server" />
       
    <div> 

        <asp:UpdatePanel ID="UpdatePanel1" runat="server" >
       
    <ContentTemplate>

            <asp:Panel ID="Panel1" runat="server" Height="137px" Width="125px" DefaultButton="ImageButton1">

                &nbsp;

                <asp:ImageButton ID="ImageButton1" runat="server" OnClick="ImageButton1_Click" OnClientClick="this.disabled=true;__doPostBack(this.name,'');"/>

                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

            </asp:Panel>

            </ContentTemplate>

             </asp:UpdatePanel>

              <asp:UpdatePanel ID="UpdatePanel2" runat="server">

             <ContentTemplate>

            <asp:Panel ID="Panel2" runat="server" Height="173px" Width="155px" DefaultButton="ImageButton2">

                &nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;           

                <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>

                <asp:ImageButton ID="ImageButton2" runat="server" OnClick="ImageButton2_Click" OnClientClick="this.disabled=true;__doPostBack(this.name,'');"/>       

                </asp:Panel>

                </ContentTemplate>

        </asp:UpdatePanel>

        </div>

        </form>

    </body>

    </html>
     

    Aspx.cs

    protected void ImageButton1_Click(object sender, ImageClickEventArgs e)

            {

                //logic for the first button

            }

     

            protected void ImageButton2_Click(object sender, ImageClickEventArgs e)

            {

                //logic for the second button

            }

     
    This works fine in both IE and firefox. When ever ‘Enter’ key is pressed within the panel, the correct button event is getting triggered.

    Now one client side validation is needed for TextBox2, the value shouldn’t be null. I tried many ways, calling it inside OnClientClick as the first statement. It works for the first time by showing the alert message. After that on entering value in TextBox2 and pressing Enter Key it goes to the first button again :([

    Any help is appreciated.

    Thanks in advance,

    bins.

  • Re: how to make client side validation work along with this.disabled=true and __dopostback.

    03-07-2008, 5:34 AM
    • Loading...
    • d_dalapati
    • Joined on 09-21-2006, 9:57 AM
    • Kolkata
    • Posts 195

    It works fine for me. I didn’t see any error in this code. Could you please post the code , where you are attaching your validation code.

  • Re: how to make client side validation work along with this.disabled=true and __dopostback.

    03-07-2008, 6:24 AM
    • Loading...
    • bins
    • Joined on 03-07-2008, 6:22 AM
    • Posts 3

    hello,

    I'm trying to attach the validation code to 'OnClientClick' of ImageButton2. When I try to call a javascript function for client side validation, validation works. But on pressing Enter key, it takes first button click always :(. (Enter key on the Panel2 should trigger ImageButton2 click).

    I'm not sure of how to make both work together, OnClientClick="this.disabled=true;__doPostBack(this.name,'');" is needed to make the default button work on firefox. But in this case how do we make client side validation? I tried the following way.

     OnClientClick="return CheckTextbox(); this.disabled=true;__doPostBack(this.name,'');". CheckTextbox was a javascript function which returns true or false based on the textbox value. This didnt help :(.

    Thanks,

    bins 

     

  • Re: how to make client side validation work along with this.disabled=true and __dopostback.

    03-07-2008, 7:02 AM
    • Loading...
    • d_dalapati
    • Joined on 09-21-2006, 9:57 AM
    • Kolkata
    • Posts 195

    Try

    OnClientClick="if(CheckTextbox() == true){this.disabled='disabled'; __doPostBack(this.name,'');}else {return false;}"

  • Re: how to make client side validation work along with this.disabled=true and __dopostback.

    03-07-2008, 11:49 AM
    • Loading...
    • bins
    • Joined on 03-07-2008, 6:22 AM
    • Posts 3

    hello,

    thanks for the reply, but it didnt work.

    I have used the code you have posted inside the OnClientClick of ImageButton2.

    <asp:ImageButton ID="ImageButton2" runat="server" OnClick="ImageButton2_Click" OnClientClick="if(CheckTextbox() == true){this.disabled='disabled'; __doPostBack(this.name,'');}else {return false;}"/>

    For testing purpose, CheckTextbox was given the following definition.

     function CheckTextbox()
    {
        alert("hello");
       
        return false;
    }

    First time on pressing 'Enter' key inside TextBox2, it showed the alert message 'hello' and didnt postback (which is correct). Once again 'Enter' key was pressed. This time the alert was not shown and it went onto trigger the Click event of the first button.

    once again thanks for the reply. any further thoughts?

    Thanks,

    bins.

     

     

     

  • Re: how to make client side validation work along with this.disabled=true and __dopostback.

    03-07-2008, 2:45 PM
    Answer
    • Loading...
    • NC01
    • Joined on 08-26-2005, 3:33 PM
    • Posts 8,538
    • TrustedFriends-MVPs

    Please try this and see if this is the behavior that you want.

    <form id="Form1" method="post" runat="server">
     <input onclick="onButtonClick();" type="button" value="HTML Button">
     <asp:ImageButton id="ImageButton2" OnClick="ImageButton2_Click" OnClientClick="return validateTextBox(this)" runat="server" ImageUrl="Xxx.jpg" />
    </form>

    <script type="text/JavaScript">
    <!--
    isOkToPostBack = false;

    function CheckTextbox()
    {
        alert("hello");

       
        return isOkToPostBack;
    }

    function validateTextBox(elementRef)
    {
     if ( CheckTextbox() == true )
     {
      elementRef.disabled = true;

      <%= GetPostBackEventReference(ImageButton2, string.Empty) %>;

      return true;
     }
     else
     {
      return false;
     }
    }

    function onButtonClick()
    {
     isOkToPostBack = true;
    }
    // -->
    </script>

    NC...

Page 1 of 1 (6 items)
Microsoft Communities
Page view counter