Introduction:
Here I will explain how to enable or disable selected or particular controls on a page using JQuery in asp.net.
Here I will explain how to enable or disable selected or particular controls on a page using JQuery in asp.net.
Description:
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 asp.net.
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 asp.net.
To implement this one we need to write
code as shown below in your aspx page
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Disable or Enable All Controls on a Page</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
</script>
<script type="text/javascript">
$(document).ready(function()
{
$("#btnEnableDisable").toggle(function() {
$("input:not(.disb),textarea,select").attr("disabled", "disabled");
$(this).attr("disabled", "");
}, function()
{
$("*").attr("disabled", "");
});
});
</script>
</head>
<body>
<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:RadioButtonList>
<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:CheckBoxList>
<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"/>
</asp:DropDownList><br/>
<textarea rows="5" cols="40" >
</textarea>
<br/>
<asp:Button ID="btnEnableDisable"
runat="server"
Text="Enable/Disable"
/>
</form>
</body>
</html>
|
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.
Demo
 |
|
If you enjoyed this post, please support the blog below. It's FREE! Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email. |
|||
Subscribe by RSS
Subscribe by Email
|
|||
2 comments :
e werwer w
hi
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.
Note: Only a member of this blog may post a comment.