TextBox Value on one tab passed to a label on another tab

TextBox Value on one tab passed to a label on another tab

I have been banging my head trying to figure out how to get this to work. I am creating a form with jQuery UI Tabs. I have 3 tabs: Basic Information, Payment Information, Confirmation.

The first two tabs have textbox's for user to fill out, and the confirmation is just a blank label that should pull the value from the corresponding textbox on tab-1.


Here is some of my code:

I have tried multiple variations below in changing lblConfirmFirst and tbFirstName as well as the .val and .html
  1. <script>
  2. $("#btnContinue").click(function () {
  3. //When your button is clicked send the value in the TextBox to lbl


  4. $("#lblConfirmFirst").val($("#tbFirstName.").html());
  5. });


  6. </script>

  1. <script>
  2. //Jquery UI Script to create the tabs, and provide functionality to jump to next tab
  3. $(document).ready(function () {
  4. var $tabs = $('#tabs').tabs();


  5. $(".nexttab").click(function () {
  6. var selected = $("#tabs").tabs("option", "active");
  7. $("#tabs").tabs("option", "active", selected + 1);
  8. });
  9. });
  10. </script>

  1. <div id="tabs">
  2.                         <ul>
  3.                             <li><a href="#tabs-1">Basic Information</a></li>
  4.                             <li><a href="#tabs-2">Payment Information</a></li>
  5.                             <li><a href="#tabs-3">Confirmation</a></li>
  6.                         </ul>

  7. <div id="tabs-1">
  8. <asp:Label runat="server" ID="lblFirstName" Text="First Name" />
  9. <asp:TextBox runat="server" ID="tbFirstName" ClientIDMode="Static" AutoPostBack="true"/>
  10. <asp:Button runat="server" ID="btnContinue" Text="Continue" CssClass="nexttab" ClientIDMode="Static" />
  11. </div>

  12. <div id=tabs-2">

  13. </div>

  14. <div id=tabs-3">
  15. <asp:Label runat="server" ID="lblConfirmFirstTitle" Text="First Name" />
  16. <asp:Label runat="server" ID="lblConfirmFirst" ClientIDMode="Static" />
  17. </div>
  18. </div>

The values in the textbox's stay in the textboxes even after navigating between tabs, however I can not get the values to pass to the label on the confirmation page. Any help would be greatly appreciated.