The jQuery library provides various options
to work with Textboxes, in this post Asp.Net jQuery Textbox set
ReadOnly, we shall see on how to set the ReadOnly property to the
Asp.net Textbox control.
$('#txtReadOnly').attr("readonly", "readonly");
Example
Create a new HTML/ASPX page
Copy the below code.
Change the mapping of the jQuery file jquery-1.7.2.js to map to your local drive.
Run the application, Click on the Set Radio Button to set the ReadOnly Property
We can set ReadOnly property to a Textboxes
using jQuery as follows.
$('#txtReadOnly').attr("readonly", "readonly");
Example
Create a new HTML/ASPX page
Copy the below code.
Change the mapping of the jQuery file jquery-1.7.2.js to map to your local drive.
Run the application, Click on the Set Radio Button to set the ReadOnly Property
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<head runat="server">
<title>TextBox</title>
<link type="text/css"
href="Stylesheet.css"
rel="Stylesheet" />
<script
type="text/javascript"
src="JavaScript/jquery-1.7.2.js"></script>
<script
type="text/javascript"
language="javascript">
$(document).ready(function() {
//
//
TextBox Set - ReadOnly Property
$('#radReadOnly_0').click(function() {
if
($('#radReadOnly_0:checked').is(':checked')) {
$('#txtReadOnly').val('');
$('#txtReadOnly').attr("readonly", "readonly");
}
});
});
</script>
</head>
<body>
<form id="frmTextBox" runat="server">
<div id="pageControls">
<table>
<tr>
<td>Textbox
(Read Only)</td>
<td>
<asp:TextBox id="txtReadOnly"
runat="server"></asp:TextBox>
runat="server"></asp:TextBox>
<asp:RadioButtonList
ID="radReadOnly"
runat="server"
RepeatDirection="Horizontal">
ID="radReadOnly"
runat="server"
RepeatDirection="Horizontal">
<asp:ListItem
Value="Set"
Text="Set"></asp:ListItem>
Value="Set"
Text="Set"></asp:ListItem>
<asp:ListItem
Value="Remove"
Text="Remove"></asp:ListItem>
Value="Remove"
Text="Remove"></asp:ListItem>
</asp:RadioButtonList>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
Run the application, click
on the Set Radio Button, notice that the text is set to Read-only and doesn’t
allow the user to enter any values.
Related Posts
Asp.Net jQuery get Textbox Values
Asp.Net jQuery Textbox set ReadOnly
Asp.Net jQuery Textbox Remove ReadOnly
Asp.Net jQuery Textbox Disable
Asp.Net jQuery Textbox Enable
Asp.Net jQuery get Textbox Values
Asp.Net jQuery Textbox set ReadOnly
Asp.Net jQuery Textbox Remove ReadOnly
Asp.Net jQuery Textbox Disable
Asp.Net jQuery Textbox Enable
No comments:
Post a Comment