# Tabs in tabs

**URL:** <https://forum.ionicframework.com/t/tabs-in-tabs/45532>\
**Category:** ionic-v1\
**Created:** [March 4, 2016, 1:45pm UTC](https://forum.ionicframework.com/t/tabs-in-tabs/45532 "2016-03-04T13:45:21Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![Arcania0311](https://avatars.discourse-cdn.com/v4/letter/a/74df32/32.png) [@Arcania0311](https://forum.ionicframework.com/u/Arcania0311)\
**Post date:** [March 4, 2016, 1:45pm UTC](https://forum.ionicframework.com/t/tabs-in-tabs/45532/1 "2016-03-04T13:45:21Z")

</div>

I’ve been trying to get nested tabs to work for quite a while now but I just can’t seem to get it working.

I have a nested tab view in a tab view, looking like this:

 ![image](https://global.discourse-cdn.com/ionicframework/original/3X/4/8/4826804f080d9a22cd8b2ed1788c2d8fe4fbaf76.png)

Now when I move to a different tab in the nested tab like so:

 ![image](https://global.discourse-cdn.com/ionicframework/original/3X/a/9/a90cd6a25b78d308ae2838b8f29ff88c48c78d40.png)

And then move to a different top level tab, like so:

 ![image](https://global.discourse-cdn.com/ionicframework/original/3X/0/f/0f3086e9fd6d32b1163c6f66d1131ceba8457703.png)

And then move back to the nested tabs I would like to see the second picture again, but instead I see the first.

My states for the nested tabs look like this:

```auto
.state('tabs.exhibition', {
  	  url: '/exhibition',
  		views: {
        'exhibition-tab@tabs': {
          templateUrl: 'app/components/tabs/tabs.exhibitors.html',
          controller: 'ExhibitorsTabsCtrl'
        }
  		}
  	})
      // Exhibitors
    	.state('tabs.exhibition.exhibitors', {
    		url: '/exhibitors',
    		views: {
    			'exhibitors-content': {
    				templateUrl: 'app/components/exhibitors/exhibitors.html',
    				controller: 'ExhibitorsCtrl'
    			}
    		}
    	})
      // Products
      .state('tabs.exhibition.products', {
        url: '/products',
        views: {
          'products-content': {
            templateUrl: 'app/components/products/products.html',
            controller: 'ProductsCtrl'
          }
        }
      })

```

And my tab like this:

```auto
<ion-tab title="exhibition" icon-off="ion-grid" icon-on="ion-grid" ui-sref="tabs.exhibition.exhibitors">
      <ion-nav-view name="exhibition-tab"></ion-nav-view>
    </ion-tab>

```

I have already tried binding the ui-sref to a variable and setting that in the scope, but this doesn’t update when I change the scoped variable. Another approach I tried was binding a ng-click to the tab and then using `$state.go(...)` but for some reason this only changes the url and does not update the view.

Any thoughts?