Extjs 4.2 edit store data in controller

Question

I have a grid which data I fill manually with data from other store:

fillfunction:function(){
    var Store=Ext.ComponentQuery.query('#grid')[0].getStore();
    var Store2=Ext.ComponentQuery.query('#grid2')[0].getStore();
    Store.each(function(record){
        var record=Ext.create('App.model.record');
        record.data['Referencia_proveedor']=record.data['codigo_erp_producto'];
        record.data['Especialidad']=record.data['nombre_comercial_1'];
        record.data['Presentacion']=record.data['forma_presentacion'];


        record.data['Porc_real_decreto']=record.data['porcentaje_real_decreto'];
        record.data['ADJ']=false;
        Store2.add(record);
    });
}

This grid has selType: 'checkboxmodel', And I have a button that changes data['ADJ'] from store(in the model this column type is boolean) from false to true. I edit the data with the next code:

changeValue:function(){
    var selection=Ext.ComponentQuery.query('#grid2')[0].getSelectionModel().getSelection();
    for (i = 0; i < selection.length; i++){
        var index=Ext.ComponentQuery.query('#grid2')[0].getStore().indexOf(selection[i]);
        var record=Ext.ComponentQuery.query('#grid2')[0].getStore().getAt(index);
        record.set('ADJ',true);
    }

    var total=Ext.ComponentQuery.query('#grid2')[0].getStore().count();
    var alterstore=Ext.ComponentQuery.query('#grid2')[0].getStore().getRange(0,total);
    Ext.ComponentQuery.query('#grid2')[0].getStore().loadRecords(alterstore,{addRecords: false});
}

If I print again the store de value of ADJ is updated,but in the grid is still the old value.How can I update the grid to see the new value?

EDIT

My grid code

var panel1=new Ext.grid.Panel({
        itemId:'panel1',
        flex:3,
        store: store,
        title:'<span style="color:blue">Title 1</span>',
        scroll:'vertical',
        stripeRows: true,
        selModel: {
            selType: 'checkboxmodel'
        },
        bbar:{
            xtype: 'container',
            layout: 'anchor',
            items: [bottombar0]
        },
        loadMask: true,
        columns:{
            items:[

                   {header:'<span>R</span>',dataIndex:'Referencia_proveedor',itemId:'',flex:1},
                   {header:'<span>A</span>',dataIndex:'Especialidad',itemId:'',flex:3},
                   {header:'<span>P</span>',dataIndex:'Presentacion',itemId:'',flex:1},
                   {header:'<span>U</span>',dataIndex:'',align:'right',itemId:'',flex:1,renderer:Unidades},
                   {header:'<span>PVL</span>',dataIndex:'',align:'right',itemId:'',flex:2,renderer:Moneda},
                   {header:'<span>RD</span>',dataIndex:'Porc_real_decreto',align:'right',itemId:'',flex:1,renderer:Porcentaje},
                   {header:'<span>ADJ</span>',dataIndex:'',align:'center',itemId:'',flex:1,renderer:adjudicado}
            ]
        }
    });

grid.getView().refresh() don´t do nothing,the records whit adj=true are not refreshing — SensacionRC

SensacionRC SensacionRC · Accepted Answer · 2016-12-19T09:06:23

It was very easy,I had a typo error

{header:'<span>ADJ</span>',dataIndex:'',align:'center',itemId:'',flex:1,renderer:adjudicado}

Here I forgot to set dataIndex to:

{header:'<span>ADJ</span>',dataIndex:'ADJ',align:'center',itemId:'',flex:1,renderer:adjudicado}

Forgot to set dataIndex of the field dataIndex:'ADJ'

And in the controller I do next:

changeValue:function(){
    var selection=Ext.ComponentQuery.query('#grid2')[0].getSelectionModel().getSelection();
    for (i = 0; i < selection.length; i++){
        var index=Ext.ComponentQuery.query('#grid2')[0].getStore().indexOf(selection[i]);
        var record=Ext.ComponentQuery.query('#grid2')[0].getStore().getAt(index);
        record.set('ADJ',true);
    }
Ext.ComponentQuery.query('#grid2')[0].getStore().commitChanges();

And with that the values in the grid refresh.I do commitChanges to clear dirty fields.

Extjs 4.2 edit store data in controller

1 Answers