Skip to Content
author's profile photo Former Member
Former Member

sap.m.ComboBox in a sap.ui.table.Column - why selectionChange is lost when scrolling?

Hi all! I have been asking questions on stackoverflow, but I think this one is pretty specific and suitable for this SAP Community forum, which is a very good source of SAPUi5 knowledge for me! I hope you can give me a piece of advice to solve this issue out.

What I want to achieve? - When a user goes to a specific row and changes the value in a cell with ComboBox inside it, after scrolling once, the selected value should be visible. Currently, it goes away.

What I have done so far? - I make a standard $.ajax() call and in its success callback I get some data, JSON.parse(data); and I create a model for the ComboBox like this:

var cbModel = new sap.ui.model.json.JSONModel({ items: data }); After that, I set the model: sap.ui.getCore().setModel(cbModel, 'modelForCombo');

After that, I begin initializing the Combo:

var cbTemplate = new sap.ui.core.ListItem({
            key: "{modelForCombo>Code}",
            text: "{modelForCombo>Name}",
            additionalText: "{modelForCombo>AdditionalText}"

Then, I create the Combo:

var theCombo = new sap.m.ComboBox({ items: {
                path: 'modelForCombo>/items',
                template: cbTemplate, templateShareable: false
            }, selectedKey = "{modelForCombo>" + colName + "}", //colName is the name of the property of the entities, that I load in the Table via another named JSONModelshowSecondaryValues: true,
            editable: isEditable,
            selectionChange: function (cmbcEvent) {
                if (isEditable === true) { // save the modification in a json object }

And for the final touch:

oTable.addColumn(new sap.ui.table.Column({
            label: new sap.ui.commons.Label({ text: 'exampleHeader' }),
            tooltip: 'popupText', template: theCombo}));

Now, it all seems to work great. When I make a SelectionChange on a particular row's combo, I get the change. When I save the changes and refresh, I see the change reflected. Binding also works. For every row, the correct item in the ComboBox is selected automatically, depending on the value in the database.

The problem: when I make a SelectionChange and scroll once (or twice..., up or down), this change is lost visually and reverted to the original state of the value for that row. Meanwhile, I have managed to "remember" correctly this change in the json object and when I send it to the server, it saves it and after a refresh, I see the change in the table for that row. What am I doing wrong? Thank you for your help in advance!

Add comment
10|10000 characters needed characters exceeded

0 Answers