Question Re: Populate grid table SAPUI5 dynamically in Technology Q&A

Populate grid table SAPUI5 dynamically

benlim — Thu, 02 Nov 2017 02:19:27 GMT

Hi Expert,

I would like to implement development in SAPUI5 whereby user able to enter number of column and grid to be generated. The grid should triggered an event to pop up message whereby which column and row is clicked.

http://jsfiddle.net/6qkdP/2/

May I know which control available in SAPUI5 able to achieve this objective.

I've tried 'sap.ui.table' but was getting error "method "addRow" cannot be used programmatically!" while generating the grid.

How should I design XML view as the view will be generated dynamically?

Any help would be much appreciated.

Thanks.

Regards,

-Ben-

Re: Populate grid table SAPUI5 dynamically

Former Member — Thu, 02 Nov 2017 03:55:39 GMT

May be you can extend the sap.ui.table.Table control, to achieve your objective in SAPUI5. You can use the "attachRowSelectionChange" method to get which row is selected in the table.

Re: Populate grid table SAPUI5 dynamically

benlim — Thu, 02 Nov 2017 04:23:20 GMT

Hi arjun_9,

Appreciate your comment. Is there any control in XML view to be created? Is it the table creation is done via in controller? I've checked on the sap.ui.table.Table documentation, to add row, we need to have data binding. But for my case, the data to be populated in each cell will by dynamic. How can I bind these dynamic value to each cell?

Re: Populate grid table SAPUI5 dynamically

Former Member — Thu, 02 Nov 2017 05:34:39 GMT

Thankyou Yen Shen, Ben Lim,

Yes, you need to create an sap.ui.table.Table in your XML view, after that, you have to bind the data (your dat) to the table, as you said your data will be dynamic. To bind dynamic value to each cell, you can use the bindRows method, wherein you can bind the whole row of the table.

Also you can use the cellClick method to handle the click event of any cell.

In the controller, just set the model to your table and you are good to go, for your application.

Hope this helps,

Regards.

Re: Populate grid table SAPUI5 dynamically

benlim — Fri, 03 Nov 2017 08:33:57 GMT

Hi arjun_9,

I'm able to bind the row dynamically as for now. But how could I declare the columns in xml view? In my current xml view, I've add column name {name}. How could I achieve to make it populate dynamically?

Re: Populate grid table SAPUI5 dynamically

Former Member — Fri, 03 Nov 2017 08:58:57 GMT

Hi Yen Shen, Ben Lim,

You can give an id to your column, and from your controller's init function, you can set the table header using the foll code :

<yourColumID>.setHeader(new sap.m.Label({text:modelTableHeader.oData.COLUMN1}));

Hope this helps,

Regards.

Re: Populate grid table SAPUI5 dynamically

Joseph_BERTHE1 — Fri, 03 Nov 2017 12:49:14 GMT

Hello,

You can bind your table to a JSon model. please look at this example : https://stackoverflow.com/questions/21731176/dynamic-binding-of-table-column-and-rows

Regards,

Re: Populate grid table SAPUI5 dynamically

benlim — Mon, 06 Nov 2017 11:35:47 GMT

Hi All,

I managed to populate the grid dynamically.

Below are my xml view and controller.

Thanks to arjun_9 and joseph.berthe for your guide.