How to populate Generic Tiles dynamically with data from Backend?

[former_member197578]

Hello SAPUI5 people,

I want to populate generic tiles with data from backend using odata service, can anyone guide me how to do this?

I am a beginner so do not have any idea about populating tiles with data coming from backend.

Thank you,

Regards,

Chetna

[Former Member · Accepted solution]

copy paste this code in the createcontent method.

  var oModel = new sap.ui.model.odata.ODataModel("proxy/http/services.odata.org/V3/(S(hwii2w0uoa1wgczn3bian230))/OData/OData.svc/");
  oModel.oHeaders = {
  "DataServiceVersion" : "3.0",                   // first check the oModel data version, since we are using data version 3 in the 
  // in the service URL that we are accessing, we set out oModel version from 2 to 3
  "MaxDataServiceVersion":  "3.0" // if not we get an error
  };

  sap.ui.getCore().setModel(oModel);



   var tileContainer = new sap.m.TileContainer("tileid",{
     height: '300px',
     tiles : [
       new sap.m.CustomTile({
         content: new sap.m.Text({text: 'Sample example'})
       })
     ]
   });


  // var tile = sap.ui.getCore().byId("tileid");
   tileContainer.setModel(oModel);

   var template = new sap.m.StandardTile({
     title : "{Name}"
   });


   tileContainer.bindAggregation(
     'tiles',
     '/Products',template


   );



   tileContainer.placeAt('content');

[former_member197578 · Accepted solution]

Thank you so much for sharing code, really helpful. if i will have any doubt will let you know.

Grateful

Best Regards

[former_member197578 · Accepted solution]

Hi indrajeet,

The code you shared is working fine for me. I just want to understand it.

Can you explain me what exactly is happening in the following lines of code:

var tileContainer = new sap.m.TileContainer("tileid",{ 

      height: '300px', 

      tiles : [ 

        new sap.m.CustomTile({ 

          content: new sap.m.Text({text: 'Sample example'}) 

        }) 

      ] 

    }); 

   // var tile = sap.ui.getCore().byId("tileid"); 

    tileContainer.setModel(oModel); 

    var template = new sap.m.StandardTile({ 

      title : "{Name}" 

    }); 

    tileContainer.bindAggregation( 

      'tiles', 

      '/Products',template 

    ); 

I still do not understand the function of bindAggregation properly, if you could explain that as well.

Thank you so much for quick and correct response.

Regards

[Former Member · Accepted solution]

I would suggest you to go through the below link. It is well documented

https://sapui5.netweaver.ondemand.com/sdk/#docs/guide/91f057786f4d1014b6dd926db0e91070.html

[Former Member · Accepted solution]

This message was moderated.

[Former Member · Accepted solution]

sap.ui.jsview("test1.abc", {

    getControllerName : function() {

        return "test1.abc";

    },

  createContent : function(oController) {

     var oModel = new sap.ui.model.json.JSONModel("   ", false);

        sap.ui.getCore().setModel(oModel);

    var tileContainer = new sap.m.TileContainer("ID",{ 

     height: '300px', 

     tiles : [ 

       new sap.m.CustomTile({ 

         content: new sap.m.Text({text: 'Sample example'}) 

       }) 

     ] 

   }); 

  // var tile = sap.ui.getCore().byId("tileid"); 

   tileContainer.setModel(oModel); 

   var template = new sap.m.StandardTile({ 

     title : "{TILE_NAME}" 

   }); 

   tileContainer.bindAggregation( 

     'tiles', 

     '/UserSet',template 

   ); 

   tileContainer.placeAt('content'); 

  }

  });

Why this is not working???

[Former Member]

like this

http://jsbin.com/buduhoyake/1/