cancel
Showing results for 
Search instead for 
Did you mean: 

Add new items and update binding context in sap.m.table

Tri
Participant
0 Kudos

Hi everyone,

I have a problem.

.

I bind odata service to this table and it has functions (Add, Edit, Save and Cancel).

So I'm able to add new rows by clicking the + button. It'll trigger the function onAddViewTaskItem (code provided below).

So I input new description and sub description for the new item. However, if I edit any current items (not the new created ones), it will trigger function updateItems in ListBase object which calls updateAggregation.

As I debug, it updates with the current binding contexts (which I see there only 3 items in contexts instead of 4). It seems that when i addItem to the table, it doesn't add the new created context to the table's binding context.

Is there anyway to update the binding context?

onAddViewTaskItem: function (oEvent) {
this.getModel("viewSettings").setProperty("/visible", true);
this.getModel("viewSettings").setProperty("/editable", true);

this._createAddRow();
},
_createAddRow: function () {
var _oContext = this._createTaskItemContext();
this._addTableRow(_oContext);
},
_createTaskItemContext: function (oEvent) {
return this.getModel("xsodata").createEntry("/TaskItems", {
properties: {
"TaskItemID": this._generateGuid(),
"YearID": this._oScheduleDetailDialog.getBindingContext("xsodata").getObject().YearID,
"TaskDescription": "",
"TaskSubDescription": "",
"DeleteFlag": ""
},
success: function (oEvent) {}.bind(this),
error: function (oEvent) {}.bind(this)
});
},
_addTableRow: function (oContext) {
var oScheduleTaskItem = this._createRowControls();
this.getView().addDependent(oScheduleTaskItem);

oScheduleTaskItem.setBindingContext(oContext, "xsodata");
this.byId("tblScheduleItems").addItem(oScheduleTaskItem);
},

_createRowControls: function (oComboBoxControl) {
return new ColumnListItem({
cells: [
this._createInputControl("viewSettings>/editable", "i18n>description", "xsodata>TaskDescription"),
this._createInputControl("viewSettings>/editable", "i18n>subDescription", "xsodata>TaskSubDescription"),
this._createCheckboxControl("viewSettings>/editable", "xsodata>DeleteFlag")
				]
			});
		},

_createInputControl: function (sEditable, sPlaceholder, sBindingProperty) {
var _oInputControl = new Input({
maxLength: 255,
editable: "{" + sEditable + "}",
placeholder: "{" + sPlaceholder + "}",
value: "{" + sBindingProperty + "}"
});

return _oInputControl;
},

_createCheckboxControl: function (sEditable, sBindingProperty) {
var _oCheckBoxControl = new CheckBox({
editable: "{" + sEditable + "}",
selected: "{= ${" + sBindingProperty + "} === 'X' ? true : false}",
select: this.handleDeleteFlagSelect
});

return _oCheckBoxControl;
},
handleDeleteFlagSelect: function (oEvent) {
var bSelected = oEvent.getParameter("selected");
var sPath = oEvent.getSource().getBindingContext("xsodata").getPath();
this.getModel("xsodata").setProperty(sPath + "/DeleteFlag", bSelected ? "X" : "");
},

Accepted Solutions (0)

Answers (2)

Answers (2)

former_member182862
Active Contributor
0 Kudos

From what I have understood from your implementation, you are adding item to the table control and not to the model. You should add the new row to the model and not the table. You have done it correctly for delete. You delete from the model.

junwu
Active Contributor
0 Kudos

i think you can do that only with jsonmodel.