CODEWITHSUNDEEP
jqueryasp.netimagebutton
Dan Rowe
Dan Rowe

Reputation: 151

JQuery disables my button before the codebehind executes

I have an Asp.net (Ver4) web page with an imageButton that is used to submit the form data to a database via the code behind of the imagebuttons click event. In the code behind I am using a response.redirect to move them to a thank you page, it is the last line in the code behind routine. Due to the DB being a little slow sometimes I want to disable the click event until the page is redirected. I am attempting to do this with jquery. I have been able to disable the button and make it appear disabled but then my code behind is not firing at all.

This is the JQuery I am using

function test() {
    $("#ImageButton1").attr("disabled", "disabled").css('opacity',' 0.5');
}

This is the aspx code for the button

<div class="button">
      <asp:ImageButton ID="ImageButton1" runat="server" Height="28px"
           OnClientClick="test();"
           onclick="ImageButton1_Click" 
           ImageUrl="media/finishbutton.jpg" 
           style="margin-top: 0px" Width="97px" />
</div>

Upvotes: 2

Views: 673

Answers (4)

Icarus
Icarus

Reputation: 63956

The easiest solution is to disable the element a little bit later after the click event has triggered. For example:

 function test() {
    setTimeout(function () { $("#<%=ImageButton1.ClientID %>").attr("disabled", "disabled").css('opacity', ' 0.5'); }, 10);
}

Upvotes: 2

udidu
udidu

Reputation: 8588

Try to add return true; at the end of your test() function

Upvotes: 0

Rohit
Rohit

Reputation: 356

You could add beforeAsyncPostBack and disable the button there like described here, or just return true from the click handler. Also, you might want to use the clientID to disable the button instead of just the element ID, which is what the server understands.

Upvotes: 0

Ashirvad
Ashirvad

Reputation: 2377

try this:

 function test() {
$("#<%=ImageButton1.ClientID%>").attr("disabled", "disabled").css('opacity',' 0.5');
//$("#ImageButton1").css('opacity', ' 0.5');

}

and in aspx

 <div class="button">
          <asp:ImageButton ID="ImageButton1" runat="server" Height="28px" OnClientClick="javascript:test();"
              onclick="ImageButton1_Click" 
              ImageUrl="media/finishbutton.jpg" style="margin-top: 0px" Width="97px" />
        </div>

Upvotes: 1

Related Questions