I am unable to edit a Table row after selection of the row, it is showing an error(attached in screenhot).

I have attached the logic and output for your reference. Please help me.enter image description here

“““““““““““““““`Controller.js“““““““““` sap.ui.define([ ‘sap/base/util/deepExtend’, "./BaseController", "sap/ui/model/json/JSONModel", "../model/formatter", "sap/ui/model/Filter", "sap/ui/model/FilterOperator", "sap/m/MessageToast", "sap/m/MessageBox" ], function (deepExtend, BaseController, JSONModel, formatter, Filter, FilterOperator, MessageToast, MessageBox) { "use strict";

return BaseController.extend("opensap.manageproducts.ManageProducts.controller.Worklist", {      formatter: formatter,     /* =========================================================== */     /* lifecycle methods                                           */     /* =========================================================== */      /**      * Called when the worklist controller is instantiated.      * @public      */     onInit: function () {         var oViewModel,             iOriginalBusyDelay,             oTable = this.byId("table");          // EDITING  a Table Row         //  var that = this;         this.oTable = this.byId("table");         this.oReadOnlyTemplate = this.byId("table").removeItem(0);          var Url = "/sap/opu/odata/IWBEP/GWSAMPLE_BASIC/";         this.oModel = new sap.ui.model.odata.ODataModel(Url, true);         this.oTable = this.byId("table");         this.getView().setModel(this.oModel);         this.oReadOnlyTemplate = this.byId("table").removeItem(0);         this.rebindTable(this.oReadOnlyTemplate, "Navigation");         this.oEditableTemplate = new sap.m.ColumnListItem({             cells: [                 new sap.m.Input({                     value: "{ProductID}",                     editable: false                 }), new sap.m.Input({                     value: "{SupplierName}",                     editable: false                 }), new sap.m.Input({                     value: "{ToSupplier/WebAddress}",                     editable: false                 }), new sap.m.Input({                     value: "{Price}",                     editable: false                 })             ]         });  rebindTable: function (oTemplate, sKeyboardMode) {         this.oTable.bindItems({             path: "/ProductSet",             template: oTemplate,             templateShareable: true,             key: "ProductId"         }).setKeyboardMode(sKeyboardMode);     },  onOpenMultiEdit: function () {         this.aProductCollection = deepExtend([], this.oModel.getProperty("/ProductSet"));         this.rebindTable(this.oEditableTemplate, "Edit");         this.oSemanticPage.setShowFooter(!this.oSemanticPage.getShowFooter());     }, 

``````````````````````````````````````````````View.xml`````````````````````````````` <mvc:View controllerName="opensap.manageproducts.ManageProducts.controller.Worklist" xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc"     xmlns:semantic="sap.f.semantic" xmlns:l="sap.ui.layout">     <semantic:SemanticPage id="page" headerPinnable="false" toggleHeaderOnTitleClick="false">         <semantic:titleHeading>             <Title text="{i18n>worklistTitle}" level="H2"/>         </semantic:titleHeading>         <semantic:content>      <Table id="table" width="auto" mode="MultiSelect"                         items="{ path: '/ProductSet', sorter: { path: 'ProductID', descending: false }, parameters: { expand: 'ToSupplier' } }"                         noDataText="{worklistView>/tableNoDataText}" busyIndicatorDelay="{worklistView>/tableBusyDelay}" growing="true" growingScrollToLoad="true"                         updateFinished=".onUpdateFinished">                         <headerToolbar>                             <OverflowToolbar>                                 <Title id="tableHeader" text="{worklistView>/worklistTableTitle}" level="H3"/>                                 <ToolbarSpacer/>                                 <SearchField id="searchField" tooltip="{i18n>worklistSearchTooltip}" search=".onSearch">                                     <layoutData>                                         <OverflowToolbarLayoutData maxWidth="200px" priority="NeverOverflow"/>                                     </layoutData>                                 </SearchField>                                 <Button icon="sap-icon://add" type="Transparent" press="onAdd"/>                                 <Button type="Transparent" id="btnMultiEdit" text="Edit Multiple" enabled="false" press="onOpenMultiEdit"/>                             </OverflowToolbar>                         </headerToolbar>                         <columns>                             <Column id="nameColumn">                                 <Text text="Products" id="nameColumnTitle"/>                             </Column>                             <Column id="supplierNameColumn" demandPopin="true" minScreenWidth="Tablet">                                 <!--This property means don't show this Cloumn on Phone, show it on Tablet, Desktop but not on phone                                                   demandPopin="true" - With this property we tell the table if we the column is not shown then show in Popup-->                                 <Text text="Supplier Name"/>                             </Column>                             <Column id="webAddressColumn" demandPopin="false" minScreenWidth="Tablet">                                 <Text text="Supplier Web Address"/>                             </Column>                             <Column id="unitNumberColumn" hAlign="End">                                 <Text text="{i18n>tableUnitNumberColumnTitle}" id="unitNumberColumnTitle"/>                             </Column>                             <Column id="editcolumn" hAlign="End">                                 <Text text="Edit" id="edit"/>                             </Column>                             <Column id="deleteColumn" hAlign="End">                                 <Text text="Delete" id="Action"/>                             </Column>                         </columns>                         <items>                             <ColumnListItem type="Navigation" press=".onPress">                                 <cells>                                     <ObjectIdentifier title="{ProductID}" text="{Name}" titleActive="true" titlePress="onPressProductId"/>                                     <Text text="{SupplierName}"/>                                     <Link text="{ToSupplier/WebAddress}" href="{ToSupplier/WebAddress}" target="_blank"/>                                     <ObjectNumber number="{ path: 'Price', formatter: '.formatter.numberUnit' }" unit="{CurrencyCode}"/>                                     <Button icon="sap-icon://edit" press="onpressedit" enabled="false" id="test"></Button>                                     <Button icon="sap-icon://delete" press="onpressdelete"></Button>                                 </cells>                             </ColumnListItem>                         </items>                     </Table>                 </content>             </IconTabBar>         </semantic:content>