Having trouble focusing on the TAB that I was currently working on

67 views Asked by At

So the page I am working on has a repeater that will populate based on people going on a trip. So if i have 4 passengers on this trip and I am saving data on TAB 3 once the page loads again it will focus on TAB 1. I am trying to find a way to focus back on TAB 3 instead. I have been trying to figure out based on a hidden field and everything like that but was just wondering if that is the correct direction to go. My example only has two passengers, so I would want to focus in on tab 2.

<-- Code Behind -->

<asp:Repeater ID="PreRegisterTabs" runat="server">
    <HeaderTemplate>
        <ul>
    </HeaderTemplate>
    <ItemTemplate>
            <li><a href="<%# String.Format("#Tab{0}", Container.ItemIndex)%>"><span class="titlecase"><%# ((Passenger) Container.DataItem).PaxName.ToLower().Replace(",", ", ") %></span></a></li>
    </ItemTemplate>
    <FooterTemplate>
        </ul>
    </FooterTemplate>
</asp:Repeater>

<-- Source View -->

<li class="ui-state-default ui-corner-top ui-tabs-active ui-state-active" role="tab" tabindex="0" aria-controls="Tab1" aria-labelledby="ui-id-3" aria-selected="true">

It then uses the C# code behind save function to save the data. Not sure how I would set the focus or save the active state of that tab.

1

There are 1 answers

0
user1566783 On

This was the answer to my question

$(function () { var selectedTabId = sessionStorage.getItem("selectedTab"); selectedTabId = selectedTabId === null ? 0 : selectedTabId; //your default being 0 $("#tabs").tabs({ active: selectedTabId, activate: function (event, ui) { selectedTabId = $("#tabs").tabs("option", "active"); sessionStorage.setItem("selectedTab", selectedTabId); } }); });