extjs grid cell editing problem

[haseeb21]

First i am a new in extjs. i have a strange problem, i am using extjs 4 cellediting plugin with extjs grid. Its working fine with one grid but when i create a new grid on the same page which also require cellediting, exiting grid data vanishes. i have spent full day in diagnose the problem but in vain.

following is the code for model, store and grids

Ext.define('site', {
    extend: 'Ext.data.Model',
    fields: [{name: 'siteid'},{name: 'description'},{name: 'picevd'},{name: 'Dateofaudit', type: 'date',dateFormat: 'Y-m-d'},{name: 'dateofrecord', type: 'date'},{name: 'id'}]
               });

Ext.define('d696', {
    extend: 'Ext.data.Model',
    fields: [{name: 'siteid'},{name: 'description'},{name: 'picevd'},{name: 'Dateofaudit', type: 'date',dateFormat: 'Y-m-d'},{name: 'dateofrecord', type: 'date'},{name: 'id'}]
               });




var Dstore = Ext.create('Ext.data.Store', {
    //autoDestroy: true,
    storeId:'Dstore',
    autoLoad:true,
    model: 'site',
    proxy: {url: '../server/sitetheftgrid.php?TYPE=SITE',type: 'ajax',reader: {type: 'json',root: 'results'}},
    sorters: [{property: 'Dateofaudit',direction:'ASC'}]                                           
                                       });// END Dstore

    Ext.create('Ext.data.Store', {
    //autoDestroy: true,
    storeId:'a',
    model: 'd696',
    proxy: {url: '../server/sitetheftgrid.php',type: 'ajax',reader: {type: 'json',root: 'results'}}
    //sorters: [{property: 'Dateofaudit',direction:'ASC'}]                                           
                                       });// END Dstore



  var cellEditing = Ext.create('Ext.grid.plugin.CellEditing', {clicksToEdit: 2});

      var grid = Ext.create('Ext.grid.Panel', {store: Dstore,
    columns: [{id: 'siteid',header: 'Site Id',dataIndex: 'siteid',width:100,field: {allowBlank: false}}, 
              {header: 'Detail',dataIndex: 'description',flex:1,field: {allowBlank: false}}, 
              {header: 'Date Of Audit',dataIndex: 'Dateofaudit',width: 150,field: {xtype: 'datefield',format: 'm/d/y'}}, 
              {header: 'Date Of Record',dataIndex: 'dateofrecord',width: 150}
             ],
    width: '100%',
    height: 300,

    id:'sitegrid',
    frame: true,
    plugins: [cellEditing]
});


        var stor=Ext.data.StoreManager.lookup('a');


        Ext.create('Ext.grid.Panel', {store:stor,
    columns: [{header: 'Site Id',dataIndex: 'siteid1',width:100,field: {allowBlank: false}}, 
              {header: 'Detail',dataIndex: 'description2',flex:1,field: {allowBlank: false}}, 
              {header: 'Date Of Audit',dataIndex: 'Dateofaudit4',width: 150,field: {xtype: 'datefield',format: 'm/d/y'}}, 
              {header: 'Date Of Record',dataIndex: 'dateofrecord2',width: 150}
             ],
    width: '100%',
    height: 300,
    id:'sitegrid2',
    frame: true, 
    autoScroll:true,            //when i uncomment this data in first grid vanishes
  /*  plugins:[ Ext.create('Ext.grid.plugin.CellEditing', {
     clicksToEdit: 1
    })]*/
});

[stephen.friedrich]

Don't re-use plugin instances.
Create another instance of the plugin for the second grid.
Most every plugin remembers state for one specific component.

[haseeb21]

thanks for your quick reply
as you suggested, i created new instance for plugin like this

plugins:new Ext.grid.plugin.CellEditing(
					{clicksToEdit: 1})

but still the same issue. please help

[haseeb21]

Dear all i have complete mess here from last two days. i 'm repeating my question for clarity[code is in first post]

i created a Grid with a Model and a store. i also used cellediting plugin to edit cells. up to this all working fine.
but then! i created another GRID with different model and store now problem starts here.

right after creating second grid 1st grid`s data vanishes and 2nd grid also does not populate. when i tries to diagnose i found when i use cellediting plugin with second grid it create a problem. Mr. stephen suggested me using new instance of cellediting plugin which also in vain.


one more thing i noticed that when i removed the plugin from 1st grid and used with second still 1st grid is editable nor the 2nd even 2nd grid vanishes.
i am unable to understand what is going wrong or their is limitation of using one grid on one page?

any suggestion ?

[haseeb21]

i accidently find the solution, i change the order of grids by putting 2nd grid top on the page and 1st after it and simmilarly to create third grid i did the same. isn't the strange solution?

[alex873]

http://docs.sencha.com/ext-js/4-0/#!/guide/direct_grid_pt2
This made my day.