O'Reilly logo

Ext JS Data-driven Application Design by Kazuhiro Kotsutsumi

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Updating the Quotation view

You've prepared everything for the grid to be displayed, so let's implement the view (source file: 03_update_the_quotation_view/app/view/quotation/List.js):

Ext.define('MyApp.view.quotation.List', {
  ...
    initComponent: function() {
        var me = this;
        Ext.apply(me, {
            columns: [{
                text: 'Customer',
                dataIndex: 'customer',
                flex: 1
            }, {
                text: 'Modified',
                dataIndex: 'modified',
                width: 120
            }, {
                text: 'Created',
                dataIndex: 'created',
                width: 120
            }]
        });
        me.callParent(arguments);
    }
});

Here you are only specifying columns. In order to abstract the grid panel, we are creating the MyApp.grid.Panel class. (source file: 03_update_the_quotation_view/app/grid/Panel.js).

We will create the MyApp.grid.Panel class that is purely inherited from ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required