This posting should show off my ignorance of dojox.

This was in a view. It managed tabbing between subviews within the view.

<ul data-dojo-attach-point="workOrderTabBar"
   data-dojo-type="dojox/mobile/TabBar"
   data-dojo-props='barType:"segmentedControl"' />

 
 

Something like the following code existed before I touched the controller. It is for newing up the tabs when first entering the view. The only thing I added was the second to last line where I put the items we put into the control above into an array named "tabs" which I established as a controller-wide variable. I needed a way to manage state for which tab was up. A pain point came up when one jumped into this view at a tab other than the very first tab. In such scenarios, the simple implementation displayed the wrong tab as up. Lame!

createTabButton: function (label, selected){
   var app = this.app;
   var self = this;
   var view = targetHelper.appendTarget(targetHelper.targetFromId(this.id), label);
   var btn = new TabBarButton( {
      label: label,
      selected: selected,
      view: view,
      onClick: function(evt) {
         var transOpts = {
            target: view,
            data: { mdoElt: self.mdoElt }
         };
         app.transitionToView(this.domNode, transOpts, evt);
      }
   });
   this.tabs.push(btn);      
   this.workOrderTabBar.addChild(btn);
},

 
 

I call out to the following at init and afterActivate in the controller to get what I want. This is code I added. This example assumes there are four tabs labeled Foo, Bar, Baz, and Qux. In taking a look at dojox/mobile/TabBar I could not clearly understand the mechanics of how tabs were handed to the tab manager/wrapper we call "workOrderTabBar." Whatever. I guessed if .addChild was available that so too would be .removeChild and I was right.

setTabs: function (){
   this.tabs.forEach(lang.hitch(this, function(btn) {
      this.workOrderTabBar.removeChild(btn);
   }));
   var currentTab = this.app.getCurrentTabName();
   this.createTabButton("Foo", currentTab == "Foo");
   this.createTabButton("Bar", currentTab == "Bar");
   this.createTabButton("Baz", currentTab == "Baz");
   this.createTabButton("Qux", currentTab == "Qux");
   this.actionButton.on("click", lang.hitch(this.actions, this.actions.open));
   this.actions.addAction("Whatever", "mblDomButtonIconAdd", lang.hitch(this,
         this.whatever));
},

 
 

There probably is a better way to empty the array holding the tabs, but I don't know what it is. Anyone want to explain to me why I suck?