How to find changed columns in EditorGridPanel, ExtJS?

While we are using EditorGridPanel, if we change some data, we see a red sign on the corner of the cell. If you want to get the changed or unchanged column info via javascript code, then read the following writing.

You may see the Editor Grid Example . Then, let’s we have a data record as following:

 var myRecord = new Ext.data.Record.create([
  {name:'vcompanyname', type: 'string'},
  {name:'vcompanybilladdress', type: 'string'},
  {name:'vcompanyaddress', type: 'string'},
  {name:'vcompanycontact', type: 'string'},
  {name:'vcompanyphone', type: 'string'},
  {name:'vcompanyemail', type: 'string'},
  {name:'vcompanytaxdept', type: 'string'},
  {name:'vcompanytaxno', type: 'string'}
  
]);

 We show the data on the EditorGridTable formatted in the Ext.data.Record. User opened the data on the page and changed some value of the table. And I want to find an answer to this question? Did phone value change? AND Did address value not change?

 function fn_checkChanges()
{
 var returnString = "You did not changed the following companies' addresses:";
 var tmpReturnString = "";
 var myGrid = Ext.getCmp('static-grid');
 var allRecords = myGrid.getStore().getModifiedRecords();
 var isThere = false;
 var willContinue = false;

 for (i=0;i < allRecords.length;i++)
 {
   var dataNew = allRecords[i].data;
   var dataChanges = allRecords[i].getChanges(); 
   if(dataChanges.vcompanybilladdress == null || dataChanges.vcompanybilladdress == 'undefined')
   {
    tmpReturnString = tmpReturnString + allRecords[i].data.vcompanyname + "<br/>";
     isThere = true;
   }
 }
 if( isThere == true )
 {
   Ext.MessageBox.show({
   title:'Onay',
   msg: returnString,
   buttons: Ext.MessageBox.YESNO,
   icon: Ext.MessageBox.QUESTION,
   fn: function (btn) {
    if (btn == 'yes') {
       willContinue=  true;
    }
    else {
       willContinue=  false;
    }
   } 
  });
 }else{
      willContinue= true;
 }
 
 return willContinue;
}

Let’s check over the code;

That returns us the changed rows, even one column value changes.

 var allRecords = myGrid.getStore().getModifiedRecords();

 

Then this returns us the changed column names!

var dataChanges = allRecords[i].getChanges(); 

 

For example if user changed “dataChanges.vcompanybilladdress” value, then “dataChanges.vcompanybilladdress” will return us the NEW VALUE. If user did not change the value on “dataChanges.vcompanybilladdress”, then dataChanges.vcompanybilladdress will return us “undefined”!!.

I had searched this use for a few hours and trying doing this myself. I hope this helps you.

See u