Icon Tab Bar load XML View in controller

Nov 21, 2016 at 03:19 PM


avatar image
Former Member

Hi All,

I want to load xmlview after icon tab bar when clicked.

xml code:

<m:IconTabBar id="tabBar" select="handleIconTabBarSelect">
<m:IconTabFilter key="displayDosir" icon="sap-icon://activity-items" tooltip="Display Dosir" text="Display Dosir">
// xml view place

<m:IconTabFilter key="peminjamanDosir" icon="sap-icon://activity-items" tooltip="Peminjaman Dosir" text="Peminjaman Dosir">
// xml view place

js code:

handleIconTabBarSelect : function(){
var view = this;
var tabBar = view.getView().byId("tabBar");

if (tabBar == "displayDosir"){
// code for load xml view 
}else if (tabBar == "peminjamanDosir"){
// code for load xml view


I want when run a handleIconTabBarSelect function, load xml file in controller. How to solve this problem?



10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

2 Answers

Best Answer
Nabi Zamani Nov 21, 2016 at 05:03 PM

Have a look at the Navigation & Routing tutorial. However, the example there uses the nav & routing features of UI5 to load tabs lazily. Furthermore, the tutorial illustrates how to implement bookmarking of tabs. I suggest you to follow this approch as well, even if it's just as a good practice...

Anyway... In your example you could use something like this:

var oView = sap.ui.xmlview(({
    viewName : "my.app.view.Home"

Make sure to call this code only once...

For further details have a look at the API docs of sap.ui.xmlview(...)

Show 1 Share
10 |10000 characters needed characters left characters exceeded

I would also suggest to follow best practice to enable bookmarking feature.

Jamie Cawley
Nov 21, 2016 at 04:46 PM

In you function you can use the event to get the key. See


You can use fragments to insert additional xml view definitions. See




SAP - Technology RIG

10 |10000 characters needed characters left characters exceeded
Skip to Content