Changing the moveTo attribute in “dojox/mobile/Heading” dynamically

One of the known issues of the Dojo mobile is that when the Dojo mobile heading dojox.mobile.Heading has a moveTo attribute, the value of the moveTo attribute cannot be changed once the widget is created. This means that the moveTo attribute will cause the back button to be always going to the initial view id that is binded to the attribute.

In order to resolve this issue (to support, for example, dynamic back navigation), you can destroy the widgets inside the dojox.mobile.Heading and then re-create the widgets again. Let’s see how to do this. The following code snippet shows the mobile heading element in the HTML file:

<div>
    <h1 data-dojo-type="dojox/mobile/Heading" data-dojo-attach-point="dynamicHeading">
    </h1>
    <!-- Other elements -->
</div>			

And in the "onBeforeTransitionIn" of the view, you can call the buildHeadingDynamic("someView") function which destroys the descendants of the heading and then re-create it again with the new moveTo value.

buildHeadingDynamic : function(backView) {
  var dynamicHeading = this.dynamicHeading;
  dynamicHeading.destroyDescendants();

  var heading = new dojox.mobile.Heading ({label:"Heading", fixed:"top", back:"Back", moveTo:"#" + backView});
  dynamicHeading.addChild(heading);		
}

Overriding Android back button behavior in Apache Cordova

If you are using Apache Cordova for building a native application on mobiles using HTML, CSS, and JavaScript. You may need to override the default behavior of the back button on the Android mobiles to implement your application specific back button behavior.

In order to do this, you can register an event handler on the "backbutton" event on the document object but before you do this, you need to make sure that the device is ready using the "deviceready" event as follows.

// In the initialization ...
document.addEventListener("deviceready", deviceReadyHandler, false);  


function deviceReadyHandler () {
    document.addEventListener("backbutton", backButtonHandler, false);
}


function backButtonHandler(e) {
    //Here implement the back button handler
}