Display Json data in table

[justin_kemp]

Hello

I am trying to display json data in table but am getting blank table everytime. Here is my code:

<Table id="Table_Id"

  items="{oModel/Hier}"

  noDataText="No  Data Created Yet" >

  <columns>

  <Column>

  <Text text="ID" />

  </Column>

  <Column >

  <Text text="Name" />

  </Column>

  </columns>

  <items>

  <ColumnListItem>

  <cells>

    <Text text="{oModel>ID}" />

  <Text text="{oModel>NAME}" />

  </cells>

  </ColumnListItem>

  </items>

  </Table>

In controller

var oModel = new sap.ui.model.json.JSONModel({

  Hier: [{

  ID: "KLJNB",

  NAME: "AJY",

   },

   {

   ID: "OLJNB",

  NAME: "OAJY",

   }

  ]

  });

  sap.ui.getCore().setModel(oModel,"omodel");

  console.log(oModel);

  },

[saivellanki · Accepted solution]

Hi Justin,

Also one more thing to add to Deepak's solution, your 'items' binding path should be:

items="{oModel>/Hier}"

Regards,

Sai.

[justin_kemp · Accepted solution]

I followed each step and corrected name and data binding, but still the result is not visible in table.

Is it because of this json model not mentioned in component.js and manifest.json. Can this block content to be mapped to table?

[junwu · Accepted solution]

show us the corrected code

[saivellanki · Accepted solution]

Hi Justin,

May be you have not added this in bootstrap:

data-sap-ui-xx-bindingSyntax="complex"

If you had corrected the code then it should work. I tried and it is working fine for me: JS Bin - Collaborative JavaScript Debugging

Regards,

Sai.

[Former Member]

Hi Justin,

bind table with "{/Hier}" and for each column just give "{ID}" and "{NAME}"

When u bind table with "{/Hier}" each object from this array is automatically binded with each rows... so in rows just specify property name as {ID} .. try this out

[deepak_sharma_sap]

Hi,

Check for difference in the name of model.

Change the name of model when setting it to oModel instead of omodel in controller.

  i.e. sap.ui.getCore().setModel(oModel, "oModel").

Thanks