aspdotnet-suresh offers articles and tutorials,csharp dot net, articles and tutorials,VB.NET Articles,Gridview articles,code examples of 2.0 /3.5,AJAX,SQL Server Articles,examples of .net technologies

Enable-disable selected or particular controls on a page using JQuery in

Jul 23, 2012

Here I will explain how to enable or disable selected or particular controls on a page using JQuery in

In previous articles I explained how to disable or enable all the controls on page using JQuery and many articles relating to JQuery. Now I will explain how to disable or enable only selected or particular controls on webpage using JQuery in

To implement this one we need to write code as shown below in your aspx page

<html xmlns="">
<title>Disable or Enable All Controls on a Page</title>
<script type="text/javascript" src="">
<script type="text/javascript">
$(document).ready(function() {
$("#btnEnableDisable").toggle(function() {
$("input:not(.disb),textarea,select").attr("disabled", "disabled");
$(this).attr("disabled", "");
}, function() {
$("*").attr("disabled", "");
<form id="form1" runat="server">
First name: <asp:TextBox ID="txtfname" runat="server"/><br />
Last name: <asp:TextBox ID="txtlname" runat="server"/><br />
Password: <asp:TextBox ID="txtpwd" runat="server"/><br/>
<asp:RadioButtonList ID="rdbtn" runat="server">
<asp:ListItem Value="male" Text="Male"/>
<asp:ListItem Value="female" Text="Female"/>
<asp:CheckBoxList ID="chkVehicle" runat="server">
<asp:ListItem Value="Bike" Text="I have a bike"/>
<asp:ListItem Value="Car" Text="I have a car"/>
<asp:DropDownList ID="ddlBuses" runat="server">
<asp:ListItem Value="volvo" Text="Volvo" />
<asp:ListItem Value="saab" Text="Saab"/>
<asp:ListItem Value="Audi" Text="Audi"/>
<asp:ListItem Value="ford" Text="Ford"/>
<textarea rows="5" cols="40" > </textarea>
<asp:Button ID="btnEnableDisable" runat="server" Text="Enable/Disable" />
If you observe above code in header section I added script file link by using that file we have a chance to interact with JQuery and in the script we have btnEnableDisable button toggle function like

$(document).ready(function() {
$("#btnEnableDisable").toggle(function() {
$("input:not(.disb),textarea,select").attr("disabled", "disabled");
$(this).attr("disabled", "");
}, function() {
$("*").attr("disabled", "");
Here whenever we click on button it will disable all the input controls including textarea and dropdownlist controls and it will leave the controls which contains class name .disb because we need enable button control while disabling all the controls.



If you enjoyed this post, please support the blog below. It's FREE!

Get the latest,, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email.

subscribe by rss Subscribe by RSS subscribe by email Subscribe by Email


Anonymous said...

e werwer w

Anonymous said...

some one please explain the piece of code"$("input:not(.disb),textarea,select").attr("disabled", "disabled");"

i could not find disb in body part .then how the above line work.

Give your Valuable Comments

Note: Only a member of this blog may post a comment.

© 2015 All Rights Reserved.
The content is copyrighted to Suresh Dasari and may not be reproduced on other websites without permission from the owner.