Akdora’s Blog

Programming, Oracle, Life, Fun

How to find changed columns in EditorGridPanel, ExtJS? February 6, 2009

Filed under: ExtJS — Akdora @ 9:35 pm
Tags: , , , ,

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.
s
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

 

3 Responses to “How to find changed columns in EditorGridPanel, ExtJS?”

  1. astro Says:

    Thank you I needed exactly this!
    Helped allot🙂

  2. Prakash Says:

    It helped me a lot thank you

  3. Rahul Verma Says:

    Thanks very much….code is upto mark…


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s