Table sapui5 binding and Simple Table Create

view.xml file : put these filen under the <content> </content>

<Table id="tableId" items="{/data}">


<columns>
<Column>
<Text text="column 1"/>
</Column>

<Column>
<Text text="column 2"/>
</Column>

<Column>
<Text text="column 3"/>
</Column>

<Column>
<Text text="column"/>
</Column>

</columns>

<items>
<ColumnListItem>
<cells>
<Text text="{column1}"/>
<Text text="{column2}"/>
<Text text="{column3}"/>
<l:VerticalLayout>
<l:content>
<ActionSelect
id="select"
class="compact"
items="{/data}">
<items>

<core:Item key="{column}" text="{column}" />

</items>

</ActionSelect>
</l:content>
</l:VerticalLayout>

</cells>
</ColumnListItem>

</items>

</Table>



controller.js File :

onInit: function() {
var a=this.getView().byId("tableId");
var b=new sap.ui.model.json.JSONModel("Model/data.json");
a.setModel (b);

},


data.json : create the folder Model in the WebContent Folder after that just make one file data.json and paste below code in that

{
"data" :[
{
"column1":"c1",
"column2":"c2",
"column3":"c3",
"column":""
},


{
"column1":"d1",
"column2":"d2",
"column3":"d3",
"column":"purple"
},

{
"column1":"e1",
"column2":"e2",
"column3":"e3",
"column":"orange"
}

]

}

Post a Comment

Previous Post Next Post