jqueryangularjskendo-tabstrip

Select first visible tab index

I have a personalized tab directive that set the active tab as the first element:

    jQuery($element).data(`kendoTabStrip`).select(0);

But now the directive receive a hidden property, when doesn't exist a set the ng-show=false

  Reflect.defineProperty($scope.tabs.tabs[name], `liElement`, {
            enumerable: false,
            writable: false,
            value: angular.element(`<li ng-show="false">{{tabs.tabs[\'' + name + '\'].title}}</li>`),
  });

Making the first visible element possibly different than the first selected, I tried 

const index = $( "li" ).index($("li:visible:first"));
jQuery($element).data(`kendoTabStrip`).select(index);

but the index always returns 0, how do I get the index based on ng-hide property?

Solution

  • Try this:

    const index = $( "li" ).index($("li[ng-show='true']:first"));

    ng-show or ng-hide does not change "visibility" attribute. It hides elements based on "display" attribute