ExtJS button does not execute handler

Question

I am creating the form below, but for some reason the select button handler doesn't get executed. Everything else is working properly (loading data into the grid). Is there something I'm missing?

Ext.Loader.setConfig({enabled:true});

Ext.define('Project', {
    extend: 'Ext.data.Model',
    fields: ['PID', 'ProjectName']
});

var projectsStore = Ext.create('Ext.data.Store', 
{
    model: 'Project',
    autoLoad: true,
    proxy:{
        type: 'ajax',
        url : 'projects.php?action=read',
        reader:{ type:'json', root:'projects', successProperty:'success' } }
});

Ext.onReady(
    function()
    {   
        var simple = Ext.create('Ext.form.Panel', {
        url:'projects.php?action=select',
        frame:true,
        title: 'Projects',
        bodyStyle:'padding:5px 5px 0',
        width: 350,
        fieldDefaults: {
            msgTarget: 'side',
            labelWidth: 75
        },
        defaultType: 'textfield',
        defaults: {
            anchor: '100%'
        },

        items: [{
            columnWidth: 0.60,
        xtype: 'gridpanel',
       store: projectsStore,
        height: 400,
        title:'General',
        columns: [
         {header: 'Id', dataIndex: 'PID', flex: 1},
         {header: 'Project Name',  dataIndex: 'ProjectName',  flex: 1},
       ]
        }],

        buttons: [{
            text: 'Select',
            handler: function() {
                Ext.Msg.alert('Selecting', action.result.msg);              
            }
        }]
    });

    simple.render('proj-form');

        projectsStore.load();   
    }
);

Answer 1

Your code is crashing when it's running the handler because action.result.msg doesn't exist.

You can look in Firebug/Chrome Dev Tools and it would have shown you the problem.