How to get set value to asp textbox using jquery example
jQuery is a javascript library which works at client side in the web browser. jQuery doesn't know about asp.net server controls. Let say when you request a page which contains asp textbox control or label control what happens at runtime, ASP.Net converts it to span html element while sending to the cient(browser).
In this asp.net blog post I will demonstrate how to get/set value to asp textbox using jQuery with an example. Find the asp.net code below :-
 |
| get set value to asp textbox using jquery example |
Default.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>How to get set value to asp textbox using jquery</title>
<script src="jquery.min.js"></script>
<script type="text/javascript">
var txtValue;
function setTextBoxValue(e) {
e.preventDefault();
txtValue = $('#<%=txtName.ClientID%>').val();
$('#<%=lblResult.ClientID%>').html(txtValue);
}
function getTextBoxValue(e) {
e.preventDefault();
alert($('#<%=lblResult.ClientID%>').html ());
}
</script>
</head>
<body>
<form id="form1" runat="server">
<h1>Get or set the asp textbox value using jquery</h1>
<div style="font-family:Verdana; font-size:16px;">
<asp:Label ID="lblName" runat="server" Text="Enter your name: "></asp:Label>
<asp:TextBox ID="txtName" runat="server"></asp:TextBox>
<br />
<br />
<asp:Label ID="lblResult" Font-Bold="true" ForeColor="Maroon" runat="server" Text=""></asp:Label>
<br />
<br />
<asp:Button ID="btnSetValue" runat="server" Text="Set Textbox Value" OnClientClick="return setTextBoxValue(event);" />
<asp:Button ID="btnGetValue" runat="server" Text="Get Textbox Value" OnClientClick="return getTextBoxValue(event);" />
</div>
</form>
</body>
</html>
Note: If you notice the selector in the above code, I have used "ClientID" to get the value of the control. This is because Asp.Net controls are rendered as html controls in the browser. The "Id" will be not same as before. In this way we can get the Asp.Net TextBox or Label values using JQuery and other asp.net controls value.
How to get set value to asp textbox using jquery example
Reviewed by Ravi Kumar
on
8:55 PM
Rating:
Reviewed by Ravi Kumar
on
8:55 PM
Rating:
No comments: