avatar image
Former Member

Icon Tab Bar load XML View in controller

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?



Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

2 Answers

  • Best Answer
    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(...)

    Add comment
    10|10000 characters needed characters exceeded

  • 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

    Add comment
    10|10000 characters needed characters exceeded

Skip to Content