Hello @Akash Yadav ,

You can achieve your use-case by following these steps: 

1. Create a Client Variable

   • Begin by defining a client variable (e.g., ScreenTab) to store the currently selected tab.

1. Update the Client Variable on Tab Change

   • In the TabsOnChange event of the Tabs component, update the ActiveTab variable with the value of the newly selected tab.

1. Initialize the Active Tab on Load

   • In the Initialized event of the Tabs component, use the SetActiveTab client action.
   • Set the active tab to the value stored in the ActiveTab client variable to ensure persistence across interactions.

I also attached an example OML.

I don't understand the title of this question. Seems in no relation to the actual question.

Hello Akash,

It seems you already know that this could be managed through client variable, then what is your questions here? Are you stuck somewhere with that impelmentation?

Junaid

Hi,

It seems you need to learn about using input variables so that when the value changes, you can control and display what you want using a condition.

Best regards!

To achieve this behavior in OutSystems 11, you need to store the active tab state before navigating to Screen B and restore it when returning to Screen A. Here’s how you can implement it:

Solution Approach

1. Store the Active Tab Before Navigating to Screen B

• Before navigating to Screen B, store the active tab's identifier in a client-side variable (Local Storage or Session Variable).
• You can do this in JavaScript or by using an OutSystems client variable.

2. Retrieve and Set the Active Tab When Returning to Screen A

• When Screen A loads, check if there’s a stored tab identifier.
• If found, set the UI to open that specific tab instead of defaulting to the first one.

Implementation Steps

Step 1: Save Active Tab Before Navigating to Screen B

1. Use JavaScript to Get the Active Tab

   localStorage.setItem("ActiveTab", document.querySelector(".tab-active").id);

2. Trigger this script on tab click event before navigating to Screen B.

Step 2: Restore Active Tab When Returning to Screen A

1. On the OnInitialize event of Screen A, retrieve the saved tab ID:

   var activeTab = localStorage.getItem("ActiveTab");if (activeTab) {    document.getElementById(activeTab).click();}

2. Ensure each tab has a unique ID for the script to work.

Alternative: Using OutSystems Client Variables

• Instead of localStorage, you can use a client variable (ActiveTab) in OutSystems and update it before navigating to Screen B.
• When Screen A initializes, read the ActiveTab variable and set the correct tab.

Hi Akash Yadav,

You can handle this scenario as an input parameter for both ScreenA and ScreenB. 

please check below attachment. Demolink.

I think I understand you very well. You want to come back to the older page A and you want to open the tab which was opened at the time of leaving the page. You want to do it using client variable.

Below are the steps -:

1). Have a local variable on screen A name it tabIdentifier.

2). When you click on your tab (say tab_3) assign tabIdentifier=tab_3.

3). ScreenB should have a non mandatory input parameter (say cameFromTab). At the time of redirecting to ScreenB assign cameFromTab=tabIdentifier.

4). ScreenB should also have a local variable cameFromTabLOC.

5). At the time of screen initialization of screen B assign cameFromTabLOC=cameFromTab.

6). Now your screen A should also have a non-mandatory input parameter named IPSelectedTab.

7). At the time of redirecting back to A (from B) assign IPSelectedTab=cameFromTabLOC (on screen B)

8). In screen A initialization, check if IPSelectedTab is set, then assign tabIdentifier=IPSelectedTab.

9). Now based on the local variable tabIdentifier you can render the tab you want.

This is how you can achieve your objective based on local variable (without using client var).

Thanks,
Sant

you need to store your selected tab value in the client variable and when you return to the page use the client variable value in OnReady event. 

If you want to load the same tab even user close the browser then you can use database to store the value and use that value in OnReady event.