Editable Array Issue in VBCS

Content

Hi All,

I am trying to implement editable array as per the guidelines provided in the jet cookbook (https://www.oracle.com/webfolder/technetwork/jet/jetCookbook.html?component=table&demo=editableArrayTable). However after making the relevant changes I am seeing that once I change the field value and navigate to the next row the modified data is no longer visible in the table. I am attaching the code used

Appreciate your inputs to resolve this issue.

 

Thanks,

Nagesh.

Code Snippet

html code
====
      <oj-table style="height:200px" summary="Sample Table" scroll-policy="loadMoreOnScroll"
        id="oj-table--1490278390-1" class="oj-flex-item oj-sm-12 oj-md-12" data="{{ $page.variables.itemArray }}"
        columns='[  {    "headerText": "ItemNumber",    "field": "itemNumber","template" :"INtemplate" ,"className": "oj-read-only" }, 
        {    "headerText": "ItemDesc",    "field": "itemDesc","template" :"IDtemplate" ,"className": "oj-read-only" },
         {    "headerText": "LongDescription",    "field": "longDescription","template" :"LDtemplate","className": "oj-read-only"  },{    "headerText":