grid example

HTML

<script src="http://cdn.sencha.io/ext-4.2.0-gpl/ext-all-dev.js"></script>
<link rel="stylesheet" href="http://cdn.sencha.io/ext-4.2.0-gpl/resources/css/ext-all.css">
<script src="http://cdn.sencha.io/ext-4.2.0-gpl/examples/ux/statusbar/StatusBar.js"></script>
<script src="http://cdn.sencha.io/ext-4.2.0-gpl/examples/ux/LiveSearchGridPanel.js"></script>
http://jsfiddle.net/Vandeplas/CUsL6/#

JavaScript

Ext.onReady(function () {
    Ext.define('MyApp.model.Mark', {
        extend: 'Ext.data.Model',
        fields: [{
            name: 'id',
            type: 'int'
        }, {
            name: 'annotation',
            type: 'string'
        }, {
            name: 'mark_date',
            type: 'date'
        }, {
            name: 'status',
            type: 'string'
        }]
    });
    Ext.define('MyApp.store.Marks', {
        extend: 'Ext.data.Store',

        //best to require the model if you  put it in separate files
        requires: ['MyApp.model.Mark'],
        model: 'MyApp.model.Mark',
        storeId: 'markStore',
        data: {
            items: [{
                id: 1,
                annotation: "Test",
                mark_date: "2013-04-24 9:28:00",
                status: "Done"
            }]
        },
        proxy: {
            type: 'memory',
            reader: {
                type: 'json',
                root: 'items'
            }
        }
    });

    var grid = Ext.create('Ext.grid.Panel', {
        itemId: 'markGrid',
        store: Ext.create('MyApp.store.Marks'),
        loadMask: true,
        width: 400,
        columns: [{
            header: '1111111111111111111',
            dataIndex: 'annotation',
            width: 230,
            flex: 1
        }, {
            header: 'Да22222222222222та',
            dataIndex: 'mark_date',
            width: 30,
            flex: 1
        }, {
            header: 'Ста3333333333333тус',
            dataIndex: 'status',
            width: 30,
            flex: 1
        }]
    });
    
    var window = Ext.create('Ext.window.Window', {
        renderTo: Ext.getBody(),
        items: [grid]
    });
    
    window.show();
});