Dynamic columns for a Table

[Murali_Shanmu]

Hi,

I am following the below code which is in JSBin. I am unable to get this working. I replaced the OData URL with a custom one which I am working on. I can retrieve the column definition, but the binding of columns does not work. Any suggestions.

Thanks,

Murali

   var sURI = 'http://demos.kendoui.com/service/Northwind.svc/';
    var oDataModel = new sap.ui.model.odata.ODataModel(sURI, true);
     sap.ui.getCore().setModel(oDataModel, 'data');
    var sEntity = '/Categories';


    var properties = oDataModel.oMetadata._getEntityTypeByPath(sEntity).property;
    var oMetaModel = new sap.ui.model.json.JSONModel();
    oMetaModel.setData({
        columns: properties,
    });


     sap.ui.getCore().setModel(oMetaModel, 'meta');


    var oTable = new sap.ui.table.Table({
        title: "OData Model dynamic column and data binding",
        showNoData: true,
        columnHeaderHeight: 10,
        visibleRowCount: 7
    });
    oTable.bindColumns('meta>/columns', function(sId, oContext) {
        var sColumnId = oContext.getObject().name;
        return new sap.ui.table.Column({
            id: sColumnId,
            label: sColumnId,
            template: new sap.ui.commons.TextView({"text" : {path: "data>" + sColumnId}}),
            sortProperty: sColumnId,
            filterProperty: sColumnId
        });
    });
    oTable.bindRows('data>'+ sEntity);
    oTable.placeAt("content");

[ChandraMahajan · Accepted solution]

Hi,

See this thread sapui5 - Dynamic binding of table column and rows - Stack Overflow

and the example shared into it.

Regards,

Chandra

[Murali_Shanmu · Accepted solution]

Thanks Chandra. I picked the code from the same location. Any other suggestion?

[shankar_gomare · Accepted solution]

hi Murli,

This is how I did dynamic cols...my column meta data is coming from the backend node as "col".

var oTableDyn = new sap.ui.table.Table("tbldyn");
oTableDyn.setModel(oModel);
oTableDyn.bindColumns("/col", function(index, context) {
var sColumnId = context.getObject().columnid;
return new sap.ui.table.Column({
id : sColumnId,
label: sColumnId,
template: sColumnId,
sortProperty: sColumnId,
filterProperty: sColumnId,
});
});

oTableDyn.bindRows("/data");

[former_member17640]

Has anyone observed that drag and drop column reordering does not change the underlying column model? It acts like the binding is one way.

enableColumnReordering is indeed set to true. Drag drop reordering works visually but the underlying model remains unchanged.

[Former Member]

hi Murali,

Can i add Sap Icon to the row selector of the Table...........?

Some thing like this

[Former Member]

JS bin example is not Working can you check

[Former Member]

This maybe useful to look at