Ep

Ep

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).
server side and client side controls in asp.net

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 :-

how to get and set textbox value in jquery,how to get or set value of textbox using jquery,how to set value in textbox through jquery
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:00 PM Rating: 5

No comments:

All Rights Reserved by Etechpulse © 2012 - 2017
Powered By Blogger

Contact Form

Name

Email *

Message *

Powered by Blogger.