Question

我有一个带Tabbar的TabPanel，里面有四个面板。当面板变得可见时，我想用AJAX调用加载第四个面板的HTML内容。

AJAX函数从服务器获取数据并将其放置在面板内，该面板使用面板更新功能。问题是当面板变得可见时如何调用此函数。简化版本是：

Pages.Contact = new Ext.Panel({

    title: 'Contact',
    html: 'test data',
    iconCls: 'user',
    cls: 'cHome',

    activate: function () {
        Pages.Contact.update("my ajax data");
    }

});

当我进入我的面板时，身体内容不受影响。有谁知道这里出了什么问题？我已经尝试用render和show替换activate。

Answer 1

要添加事件的侦听器，您需要执行

    listeners: {
                activate: function(){
                 console.log('activate fired');
                } 
   },

但那不是你想听的事件。最好在TapPanel对象上监听beforecardswitch，例如：

    listeners: {
                beforecardswitch:function(newCard, oldCard, index, anim){
                  if(index == 3){
                     //loadJson and update card.
                      // you may want to use this also 
                      newCard.setLoading(true);
                      //and after the json request has finished set it to false.
                    }             
                }
    },

Answer 2

解决方案是使用：

beforecardswitch:function(object, newCard, oldCard, index, anim) {

如Ilya139所示，将object参数作为第一个参数。

然后索引变量返回正确的卡号。

在显示面板时，在Sencha touch中使用AJAX加载html数据

2 个答案: