网格中的ExtJS进度条

Question

有没有办法在网格的页脚（fbar）中添加进度条？我已成功地向网格面板添加按钮，但进度条没有运气。

我在fbar中试过这个：

fbar: [{
                type: 'progress',
                text: 'updating...'
      }]

但结果是一个按钮，文本“更新”被添加到页脚。

有人知道我做错了吗？

Answer 1

假设Ext4

Ext.require(['Ext.data.*', 'Ext.grid.*']);

Ext.define('Restaurant', {
    extend: 'Ext.data.Model',
    fields: ['name', 'cuisine']
});

Ext.onReady(function() {
    var restaurants = Ext.create('Ext.data.Store', {
        storeId: 'restaraunts',
        model: 'Restaurant',
        data: [{
            name: 'Cheesecake Factory',
            cuisine: 'American'
        }]
    });

    var grid = Ext.create('Ext.grid.Panel', {
        renderTo: Ext.getBody(),
        store: restaurants,
        width: 600,
        height: 400,
        frame: true,
        columns: [{
            text: 'Name',
            flex: 1,
            dataIndex: 'name'
        }, {
            text: 'Cuisine',
            flex: 1,
            dataIndex: 'cuisine'
        }],
        fbar: [{
            xtype: 'progressbar',
            text: 'Foo',
            width: 200
        }]
    });
});