Post
Ask Question

Get and Set Value of Label using JQuery

JQuery

JQuery is light weight javascript library and main role of jquery easily use javascript on your website.

Syntax of jquery:

$(Selector).action();

  1. $ Symbol to access jquery
  2. Selector is used to find HTML element
  3. Action is used for perform action on element

This Article, I want to explain Get and Set value of label using JQuery:

A. Get Value from Label

  1. alert($('#lbl').html());  
B. Set value to Label
  1. $('#lbl').val("Vishvajeet")  
  2. $("#lbl").html("Vishvajeet")  
  3. alert($('#lbl').val());  
Example:
  1. <html xmlns="http://www.w3.org/1999/xhtml">  
  2. <head id="Head1" runat="server">  
  3. <title></title>  
  4. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>  
  5. <script type="text/javascript">  
  6.     $(document).ready(function () {  
  7.         $('#btnGet').click(function () {  
  8.             //Get value  
  9.             alert($('#lbl').html());  
  10.         })  
  11.         $('#BtnSet').click(function () {  
  12.             // Set value  
  13.             $('#lbl').val("Set Value :- Vishvajeet")  
  14.             $("#lbl").html("Set Value :- Vishvajeet")  
  15.             alert($('#lbl').val());  
  16.         })  
  17.     });  
  18. </script>  
  19. </head>  
  20. <body>  
  21. <form id="form2" runat="server">  
  22. <br />  
  23. <div style="padding-left:100px">  
  24. <asp:Label ID="lbl" runat="server" Text="Vishvajeet Pawar"></asp:Label>  
  25. <br />  
  26. <asp:Button ID="btnGet" runat="server" Text="Get Value" />  
  27. <asp:Button ID="BtnSet" runat="server" Text="Set Value" />  
  28. </div>  
  29. </form>  
  30. </body>  
  31. </html>  
A. Form Design:

                           get value

B. Get Value from Label:

                           get value at local host

C. Set value to the Label:

                              set value