Skip to Content

Archived discussions are read-only. Learn more about SAP Q&A

Dynamic Table: Need unique ID for each cell

Hi,

I am writing a UI5 app that will contain a dynamic table, which will be bound to a JSON model.

I would like to have each cell on the table have a unique ID. I then use this ID to group into another structure. So for example the table could have 3 rows, which I want to combine into 2 rows. Row 1 & 2 being mapped to the new Row 1 and Row 3 being mapped to the new Row 2.

This is the code I have so far: -

// Define some sample data

            var aData = [ {

                lastName : "Dente",

                lastNameID : "E1_1",

                name : "Al",

                nameID : "E2_1"               

            }, {

                lastName : "Friese",

                lastNameID : "E1_2",

                name : "Andy",

                nameID : "E2_2"               

            } ];

            // Create an instance of the table control

            var oTable = new sap.ui.table.Table({

                title : "Table Example",

                visibleRowCount : 7,

                firstVisibleRow : 3,               

                selectionMode: sap.ui.table.SelectionMode.None,

                enableColumnReordering : false,

                toolbar : new sap.ui.commons.Toolbar({

                    items : [ new sap.ui.commons.Button({

                        text : "Button in the Toolbar",

                        press : function() {

                            alert("Button pressed!");

                        }

                    }) ]

                }),

                extension : [ new sap.ui.commons.Button({

                    text : "Button in the Extension Area",

                    press : function() {

                        alert("Button pressed!");

                    }

                }) ]

            });                   

            // Define the columns and the control templates to be used

            var oColumn = new sap.ui.table.Column({

                label : new sap.ui.commons.Label({

                    text : "Last Name"

                }),

                template : new sap.ui.commons.TextField("lastNameID").bindProperty("value",

                        "lastName"),           

                width : "100px"

            });

            oTable.addColumn(oColumn);

            oTable.addColumn(new sap.ui.table.Column({

                label : new sap.ui.commons.Label({

                    text : "First Name"

                }),

                template : new sap.ui.commons.TextField("nameID").bindProperty("value",

                        "name"),               

                width : "100px"

            }));

            // Create a model and bind the table rows to this model

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

            oModel.setData({

                modelData : aData

            });

            oTable.setModel(oModel);

            oTable.bindRows("/modelData");

            // Initially sort the table

            oTable.sort(oTable.getColumns()[0]);

            // Bring the table onto the UI

            oTable.placeAt("idViewRoot--idViewDetail--toolBar-content");

You will see on the JSON model, there is an element called " lastNameID". I would ideally like this to be used for the cell row 1, col 1 when the table is output. And likewise the element "nameID" would be set on Row 1, Col 2.

I hope this makes sense.

Is this possible, if not , I will need to think of another way of doing it.

Any help is much appreciated.

Thanks

Martin

Former Member
Not what you were looking for? View more on this topic or Ask a question