aspx Tutorial

NET Articles,jQuery demo, with jQuery, online tutorial,Jquery, SilverLight, Javascript,,JSON, MVC,.NET Articles,demo, Web Services,
Advertise Here


Get our toolbar!


Posted by Aamir Hasan   on Tuesday, July 13, 2010 Total Views:  
In this Article, I will demonstrate how to Disable/Enable button in use jQuery. To avoid multiple clicks on submit button, we simply disable the submit button during the process.
You can download jQuery current version from jQuery Site.
Let's start.

Step 1:

I have created a ASP.NET website. You can create a page in your existing web site.

Step 2:

Download jQuery current version from jQuery Site. You can also load jQuery online Reference from Microsoft or Google CDNs as links given below.



Create a Reference in the <Head> section of your Page as shown below.

   <title>Disable/Enable Button using jQuery</title>

Step 3:

Now under the <Body> Section add Texbox, Buttton and Label as shown below.

       Name:<asp:TextBoxID="TextBox1"runat="server"Text="Aamir Hasan"></asp:TextBox>

Step 4:

Add the following script to Disable button while fetching data from server and Enable after data is fetched as shown below.

   $(function () {
   function getCars() {
       $('#Button1').attr("disabled", "true");
           type: "POST",
           url: "Default.aspx/getResult",
           data: "{result:'" + $("#TextBox1").val() + "'}",
           contentType: "application/json; charset=utf-8",
           dataType: "json",
           success: function (response) {
           failure: function (msg) {

Step 5:

Write a Method which will return a string from server side to client side as given below.

   publicstaticstring getResult(string result)
       return"Hello! " + result;

You have noticed that method has been decorated with [WebMethod] attribute to allow from client side script. This will allow you return JSON data. Build the website and Run it, Click on Submit button. Button will be disable while fetching data from server side as shown below.

Step 6:

Output screen is shown below.

You can download source code from Here. Online Demo

Category: All | | jQuery | JSON
Protected by Copyscape Online Plagiarism Tool

Comments (3) -

Ella Glor
Ella Glor United States
6/28/2015 4:58:59 PM #

What's up, after reading this amazing post i am too delighted to share my knowledge here with mates.|

Melodee Chavez
Melodee Chavez United States
6/28/2015 5:03:23 PM #

Excellent weblog here! Also your website lots up fast! What host are you the use of? Can I get your associate link on your host? I want my site loaded up as fast as yours lol|

Charlyn Chien
Charlyn Chien United States
7/7/2015 2:23:22 PM #

It's perfect time to make some plans for the future and it is time to be happy. I have read this post and if I could I want to suggest you some interesting things or tips. Perhaps you could write next articles referring to this article. I wish to read more things about it!|

Vivienne Arabie
Vivienne Arabie United States
7/8/2015 2:11:51 PM #

I will right away grab your rss feed as I can not find your e-mail subscription hyperlink or e-newsletter service. Do you've any? Please permit me understand in order that I may just subscribe. Thanks.|

Jovita Rebman
Jovita Rebman United States
7/13/2015 7:34:59 AM #

If some one wishes expert view regarding running a blog afterward i propose him/her to go to see this blog, Keep up the good job.|

Add comment

  Country flag

  • Comment
  • Preview

Advertizement 1
Advertizement 2
Advertizement 3
Advertizement 4
Advertizement 5