Merge Columns in SAPUI5

[former_member723794]

Hi Experts,

We have mergeDuplicates property for merging cells. What about the columns.

Can anyone please help me to achieve this with SAPUI5.

image.png

Thanks in advance..!!

[sonalika_porwal]

Hi Chaitali,

I far as I am aware, there is no standard property to merge columns. However, there are multiple ways to achieve this. One very common way would be to write a custom logic for your table to merge the columns.

You can try the following code example where I am merging duplicate columns with the same column names:

let table= this.getView().byId("myTableId"); 
let columns = table.getColumns();

// iterate through the columns
for (var i = 0; i < columns.length; i++) {
  var column = columns[i];
  var columnName = column.getLabel().getText(); // get the column label text

  // iterate through remaining columns to find duplicates
  for (var j = i + 1; j < columns.length; j++) {
    var nextColumn = columns[j];
    var nextColumnName = nextColumn.getLabel().getText();

    // checks if the column label text is the same
    if (columnName === nextColumnName) {
      // merge the duplicate columns
      column.addMultiLabel(nextColumn.getLabel());
      table.removeColumn(nextColumn);
      columns.splice(j, 1); 
      j--;
    }
  }
}

You can also look into this. A similar question - https://answers.sap.com/questions/309398/how-to-merge-two-column-header-cells-in-sapui5-tab.html