intente integrar los dos plugins pero no me carga los datos en la grilla sin embargo la respuesta del json si me la da pues la puedo ver en la consola del firefox alguna idea?

Ext.BLANK_IMAGE_URL = '../ext-3.1/resources/images/default/s.gif';
Ext.onReady(function(){
    Ext.QuickTips.init();
    
    // for this demo configure local and remote urls for demo purposes
    var url = {
        local:  'grid-filter.json',  // static data file
        remote: 'grid-filter.php'
    };
    // configure whether filter query is encoded or not (initially)
    var encode = false;
    
    // configure whether filtering is performed locally or remotely (initially)
    var local = true;
    store = new Ext.data.JsonStore({
        // store configs
        autoDestroy: true,
        //url: (local ? url.local : url.remote),
        url: url.remote,
        remoteSort: false,
        sortInfo: {
            field: 'id',
            direction: 'ASC'
        },
        storeId: 'myStore',
        
        // reader configs
        idProperty: 'id',
        root: 'data',
        totalProperty: 'total',
        fields: [{
            name: 'id'
        }, {
            name: 'nombre',
            type: 'string'
        }, {
            name: 'tipo_entidad',
            type: 'string'
        }, {
            name: 'estado',
            type: 'string'
        }, {
            name: 'fecha',
            type: 'date',
            dateFormat: 'Y-m-d H:i:s'
        }, {
            name: 'observacion',
            type: 'string'
        }]
    });
//PARA AGRUPACMIENTO GRILLAS
    // shared reader
    var reader = new Ext.data.ArrayReader({}, [
       {name: 'id', type:'numeric'},
       {name: 'nombre', type: 'string'},
       {name: 'tipo_entidad', type: 'string'},
       {name: 'estado', type: 'string'},
       {name: 'fecha', type: 'date', dateFormat: 'n/j h:ia'},
       {name: 'observacion', type: 'string'}
    ]);
    var filters = new Ext.ux.grid.GridFilters({
        // encode and local configuration options defined previously for easier reuse
        encode: encode, // json encode the filter query
        local: local,   // defaults to false (remote filtering)
        filters: [{
            type: 'numeric',
            dataIndex: 'id'
        }, {
            type: 'string',
            dataIndex: 'nombre',
            disabled: true
        }, {
            type: 'list',
            dataIndex: 'tipo_entidad',
            options:['publica', 'privada'],
            phpMode: true
        }, {
            type: 'list',
            dataIndex: 'estado',
            options: ['en conversacion', 'se hizo demo', 'solicito cotizacion', 'se cerro operacion','operacion cancelada'],
            phpMode: true
        }, {
           type: 'date',
           dataIndex:'fecha'
        }, {
            type: 'string',
            dataIndex: 'observacion',
            disabled: true
        }]
    });    
    
    // use a factory method to reduce code while demonstrating
    // that the GridFilter plugin may be configured with or without
    // the filter types (the filters may be specified on the column model
    var createColModel = function (finish, start) {
        var columns = [{
            dataIndex: 'id',
            header: 'Id',
            // instead of specifying filter config just specify filterable=true
            // to use store's field's type property (if type property not
            // explicitly specified in store config it will be 'auto' which
            // GridFilters will assume to be 'StringFilter'
            filterable: true
            //,filter: {type: 'numeric'}
        }, {
            dataIndex: 'nombre',
            header: 'Nombre',
            id: 'nombre',
            width:100,
            filter: {
                //type: 'string'
                // specify disabled to disable the filter menu
                //, disabled: true
            }
        }, {
            dataIndex: 'tipo_entidad',
            header: 'T.Entidad',
            filter: {
                //type: 'numeric'  // specify type here or in store fields config
            }
        }, {
            dataIndex: 'estado',
            header: 'Estado',
            filter: {
                type: 'list',
                options: ['en conversacion', 'se hizo demo', 'solicito cotizacion', 'se cerro operacion','operacion cancelada']
                //,phpMode: true
            }
        }, {
            dataIndex: 'fecha',
            header: 'Fec.cierre ',
            renderer: Ext.util.Format.dateRenderer('d/m/Y'),
            filter: {
                //type: 'date'     // specify type here or in store fields config
            }            
        }, {
            dataIndex: 'observacion',
            header: 'Observacion',
            width:300,
            filter: {
                //type: 'boolean'  // specify type here or in store fields config
            }
        }];
        return new Ext.grid.ColumnModel({
            columns: columns.slice(start || 0, finish),
            defaults: {
                sortable: true
            }
        });
    };
    
    var grid = new Ext.grid.GridPanel({
        border: false,
        //store: store,
         store:  new Ext.data.GroupingStore({
            reader: reader,
            proxy:new Ext.data.HttpProxy({url:url.remote}),
            sortInfo:{field: 'id', direction: "ASC"},
            groupField:'estado' 
        }),
        colModel: createColModel(6), // aqui pones cuantas columnas salgan en la grilla
        loadMask: true,
        height: 400,
        width: '100%',
        plugins: [filters],
        autoExpandColumn: 'nombre',
     listeners: {
            render: {
                fn: function(){
                    store.load({
                        params: {
                            start: 0,
                            limit: 50
                        }
                    });
                }
            }
        },
        view: new Ext.grid.GroupingView({
            forceFit:true,
            groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
        }),
        bbar: new Ext.PagingToolbar({
            store: store,
            pageSize: 50,
            plugins: [filters]
        })
    });
    // add some buttons to bottom toolbar just for demonstration purposes
    
/*
    grid.getBottomToolbar().add([
        '->',
        {
            text: 'Encode: ' + (encode ? 'On' : 'Off'),
            tooltip: 'Toggle Filter encoding on/off',
            enableToggle: true,
            handler: function (button, state) {
                var encode = (grid.filters.encode===true) ? false : true;
                var text = 'Encode: ' + (encode ? 'On' : 'Off'); 
                // remove the prior parameters from the last load options
                grid.filters.cleanParams(grid.getStore().lastOptions.params);
                grid.filters.encode = encode;
                button.setText(text);
                grid.getStore().reload();
            } 
        },{
            text: 'Local Filtering: ' + (local ? 'On' : 'Off'),
            tooltip: 'Toggle Filtering between remote/local',
            enableToggle: true,
            handler: function (button, state) {
                var local = (grid.filters.local===true) ? false : true;
                var text = 'Local Filtering: ' + (local ? 'On' : 'Off');
                var newUrl = local ? url.local : url.remote;
                 
                // update the GridFilter setting
                grid.filters.local = local;
                // bind the store again so GridFilters is listening to appropriate store event
                grid.filters.bindStore(grid.getStore());
                // update the url for the proxy
                grid.getStore().proxy.setApi('read', newUrl);
                button.setText(text);
                grid.getStore().reload();
            } 
        },{
            text: 'All Filter Data',
            tooltip: 'Get Filter Data for Grid',
            handler: function () {
                var data = Ext.encode(grid.filters.getFilterData());
                Ext.Msg.alert('All Filter Data',data);
            } 
        },{
            text: 'Clear Filter Data',
            handler: function () {
                grid.filters.clearFilters();
            } 
        },{
            text: 'Reconfigure Grid',
            handler: function () {
                grid.reconfigure(store, createColModel(6));
            } 
        }    
    ]);
*/
/* //si quieres que tu grilla se vea en una ventana flotante descomenta esto
    var win = new Ext.Window({
        title: 'Listado Oportunidades',
        height: 400,
        width: 700,
        layout: 'fit',
        items: grid
    }).show();
*/
    var pante = new Ext.Panel({
        title: 'Listado Oportunidades',
        height: '100%',
        width: '100%',
        renderTo:'grillita',
        collapsible: true,
        items: grid
    });
    
});

un JsonStore es muy diferente a un ArrayReader. El propósito de un JsonStore es almacenar información en formato JSON, para esto utiliza un JsonReader, el cual es el responsable de interpretar la información recibida. La función de un ArrayReader es solamente poder interpretar la información que es recibida en un ArrayStore. Saludos

Stock un favor tengo problema con mostrar ñ en grilla no se porque me he dado cuenta que cuando la consulta escupe el json el valor con ñ no lo muestra sale un valor nullo, pero en mi base de datos si esta el valor registrado con ñ se que lei sobre el header('Content-Type: text/html; charset=UTF-8'); <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> pero ni a un asi es como que cuando la consulta viene de la bd en ese lapso se pierde el dato con ñ por favor podrias ayudarme

intenta cambiar el encodig a UTF-8 del archivo de tu código fuente, quizas eso sea. saludos