Rearrange cells in a sap.m.ColumnListItem

[csaba_molnar3]

I have a freestyle SAPUI5 application with a sap.m.Table. The Table is defined in an XML view and its "items" aggregation contains a single sap.m.ColumnListItem which contain 10 cells. The cells are fairly complex, several of them contain multiple Controls.

I wanted to implement Personalization (using the sap.m.p13n.Engine available since 1.115). SAP has several samples in the SAPUI5 docs but all are very basic in handling the sap.m.ColumnListItem cells. Whenever you change the Personalization, the sample creates a new sap.m.ColumnListItem object with new sap.m.Text objects.

Unfortunately, my case is not that simple. My Table definition is over 300 lines in the XML view. It would be an overkill to convert all that to JS code, so that at every Personalization change I recreate my entire Table from JS code.

So my question is, what is the correct way to rearrange the cells in a ColumnListItem from JS code? I tried about 6-7 different approaches but none of them worked 100%. I faced problems like

• I rearrange the cells in the ColumnListItem (with removeCell and addCell) but in the browser the cells are not rearranged.
• If I create a new ColumnListItem, I cannot create it with the old ID, because the old ColumnListItem still exists somewhere.
• Sometimes when I tried to add the cells in a new place it is impossible because the cells were already destroyed.

I guess, performance wise the most ideal method would be to reuse both the cells (and not recreate them every time) and ideally reuse the ColumnListItem.