如何在Sencha中刷新视图面板?

时间:2015-12-31 21:33:10

标签: extjs sencha-touch-2

这看起来很简单,但我需要能够在Web服务调用后刷新视图。

屏幕上的数据与商店无关,因为它是在运行时动态构建的。

以下是我的观点:

Ext.define('CAMSApp.view.OpBuyoffView', {
extend: 'Ext.Panel',
alias: ['widget.opbuyoffview'], //ToDo Use I18N 
    config: {
        xtype: 'panel',
        cls: 'dialogview formview',
        centered: true,
        scrollable: 'vertical',
        modal: true,
        screenId: 'opbuyoffview',
        id: 'opBuyoffTableContainer',
        layout: {
            type: 'vbox',
            align: 'center',
        },
        defaults: {
            minHeight: 46
        },
        items: [
        {
        xtype: 'toolbar',
        docked: 'top',
        title: 'Buyoffs',
        cls: 'grey-bold-34pt',
        ui: 'transparent',
        items: [{
            xtype: 'button',
            cls: 'grey-bold-40pt greyBtn',
            text: 'Close',
            idForAction: 'opbuyoff-cancel_btn',
        },  {
            xtype: 'spacer',
        }],
        },
        {   id: 'opBuyoffToolbar',
            xtype: 'container',
            layout: {
                type: 'hbox',
                align: 'left',
            },
            items: [
            {
               xtype: 'button',
               cls: 'blueRoundedBtn',
               text: 'Buyoff',
               idForUpdate: 'opbuyoff-buyoff_btn',
               disabled: true
            },

            { xtype: 'spacer',
              minWidth: 480
            }]
        },
        {
            xtype: 'container',
            layout: {
                type: 'hbox',
                align: 'stretch'
            },
            defaults: {
                xtype: 'label',
                style: 'border:1px solid black',
                cls: 'opBuyoffTableHeader',
            },
            id: 'tabOfBuyoffs',
            items: [{
                html: '',
                minWidth: 60
            }, {
                html: 'Buyoff',
                minWidth: 250
            }, {
                html: 'Partial %',
                minWidth: 100
            }, {
                html: 'Completed',
                minWidth: 120
            },
            {
                html: '',
                cls: 'opBuyoffTransparent',
                minWidth: 50
            }
            ]
        }],
        listeners: {
        initialize: function(me, eOpts) {
            CAMSApp.util.I18N.resolveStaticUIBindings(me); 
        },
        show: function (me, eOpts) {
            // Publish the screen id event.
            log('[OpBuyoff.show]');
            CAMSApp.app.fireEvent('setscreenfocus', this);
        },
    },
}
});

我尝试过阅读View和Container - 但这两个元素都没有doLayout()或refresh()函数。

2 个答案:

答案 0 :(得分:1)

容器和面板有一个名为update(Ext.AbstractComponent-method-update)的方法,可用于更新视图的HTML内容。

此外,您可以使用XTemplate创建项目并将面板绑定到商店。在这种情况下,您不必手动删除并添加所有元素。

答案 1 :(得分:0)

refresh: function() {
   // Ext.StoreMgr.get('stream').load();
   // here I'd like to reload the app instead
   // not just the store
      window.location.reload(); 
}