Skip to main content
R
rhudd10-Marble
10-Marble
February 26, 2020
Solved

Determining Active Tab Number as String

  • February 26, 2020
  • 1 reply
  • 1653 views

Regarding this post: Determining Active Tabs  

 

Using the proposed solution, when a button is pressed, I would like a label to display the current active tab number.

 

My attempt is below but this currently isn't working. Any advice would be appreciated. 

 

$scope.buttonPress = function(){
 var tabID = $scope.testClickTab();
 $scope.setWidgetProp( "label-9", "text", tabID);
}


$scope.testClickTab=function(key) {
	angular.forEach( 
 	$element.find('twx-tab'), function(value, key) {
 if(value['style']['display']=='block') console.error(key); 
 } )
};

 

Best answer by tincescu

(view in My Videos)

// $scope, $element, $attrs, $injector, $sce, $timeout, $http, $ionicPopup, and $ionicPopover services are available



function isHidden(el) {
 return (el.offsetParent === null)
}


angular.element(document).ready(function () {

	//$scope.ShowTabState(); 

});


$scope.ShowTabState = function() {
 var tabs = document.getElementsByClassName("tab");
 	for(i=0; i<tabs.length; i++) { 	
 if(isHidden(tabs[i]) == false) {
 	$scope.app.view.Home.wdg["label-1"].text = "Current Tab " + i;
 } 
 }
}

 

Is this the behaviour you want?

1 reply

T
tincescu5-Regular MemberAnswer
5-Regular Member
February 27, 2020

(view in My Videos)

// $scope, $element, $attrs, $injector, $sce, $timeout, $http, $ionicPopup, and $ionicPopover services are available



function isHidden(el) {
 return (el.offsetParent === null)
}


angular.element(document).ready(function () {

	//$scope.ShowTabState(); 

});


$scope.ShowTabState = function() {
 var tabs = document.getElementsByClassName("tab");
 	for(i=0; i<tabs.length; i++) { 	
 if(isHidden(tabs[i]) == false) {
 	$scope.app.view.Home.wdg["label-1"].text = "Current Tab " + i;
 } 
 }
}

 

Is this the behaviour you want?

T
tincescu5-Regular Member
5-Regular Member
February 27, 2020

My approach is this.

We check in the ShowTabState what elements with the class tab are visible on the screen (in our case it will be always one). 

 

tincescu_0-1582797109009.png

 

Then we call this funtion when the button is pressed.

tincescu_1-1582797122658.png

 

 

R
rhudd10-MarbleAuthor
10-Marble
February 27, 2020

Hi @tincescu ,

 

Yes, that's exactly what I'm looking for, thank you very much 😁

 

Also, I appreciate the video, it helps to make communication clear and is a nice touch 🙂

 

For clarity, should anyone else use this approach, 'tab' is entered as the class for each individual tab, not for the tab object as a whole. I made this mistake initially.

 

Many thanks

Terms & ConditionsCookie settingsAccessibility statement