Basic store and grid panel with a text filter.

BasicGridPanel.js

Ext.create('Ext.data.Store', {
    storeId:'simpsonsStore',
    fields:['username', 'name', 'email', 'phone'],
    data:{'items':[
        { 'username': 'lsimpson', 'name': 'Lisa',  'email':'lisa@simpsons.com',  'phone':'555-111-1224'  },
        { 'username': 'bsimpson', 'name': 'Bart',  'email':'bart@simpsons.com',  'phone':'555-222-1234' },
        { 'username': 'hsimpson', 'name': 'Homer', 'email':'home@simpsons.com',  'phone':'555-222-1244'  },
        { 'username': 'msimpson', 'name': 'Marge', 'email':'marge@simpsons.com', 'phone':'555-222-1254'  }
    ]},
    proxy: {
        type: 'memory',
        reader: {
            type: 'json',
            root: 'items'
        }
    }
});

Ext.create('Ext.grid.Panel', {
    id: 'user-list-grid-panel',
    title: 'Users',
    store: Ext.data.StoreManager.lookup('simpsonsStore'),
    columns: [
        { header: 'Username',  dataIndex: 'username' },
        { header: 'Name',  dataIndex: 'name' },
        { header: 'Email', dataIndex: 'email', flex: 1 },
        { header: 'Phone', dataIndex: 'phone' }
    ],
    height: 200,
    width: 400,
    tbar: [
        {
            xtype: 'textfield',
            name: 'txtFilter',
            id: 'txtFilter'
        }, {
            text: 'Go',
            xtype: 'button',
            //cls: 'button-primary',
            margin: '0 0 0 10',
            listeners: {
                click: {
                    fn: function() { 
                        var val, grid, len;
                        val = Ext.getCmp('txtFilter').getValue(); 
                        grid = Ext.getCmp('user-list-grid-panel');
                        len = val.length;

                        if(grid && len > 0){
                            grid.getStore().filter([{id: 'email', property: 'email', value: val }]) 
                        }
                    }
                }
            }
        }, {
            text: 'Reset',
            xtype: 'button',
            //cls: 'button-primary',
            margin: '0 0 0 10',
            listeners: {
                click: {
                    fn: function() { 
                        var grid = Ext.getCmp('user-list-grid-panel');
                        if(grid) {
                        // This function will automatically reload the store.
                        grid.getStore().clearFilter(false);
                        // If that is not desirable, do this instead:
                        // grid.getStore().filters.clear();
                        }
                    }
                }
            }
        }
    ],
    renderTo: Ext.getBody()
    }
);