1

前段时间我开始学习 ExtJS 库,现在我想创建以下内容:

有一个浏览器窗口,它是垂直分开的。
左边有一个带有目录和子目录的 TreePanel(只有 2 级深)。
在右侧将输出所选子目录的内容。

我已经完成了界面部分,但是当用户单击左侧的子目录时,我不知道如何更改右侧的内容。我可以使用 Ext.Ajax.request 发出请求,但我不知道如何触发右侧内容的更新。

顺便一提。正如我所说,左侧是 TreePanel,右侧是 GripPanel,它们在 Viewport 中,带有 xtype : 'panel',但我认为这对于这个问题并不重要。

有什么建议么?

4

1 回答 1

1

首先,您需要注册用户在树形面板中选择节点的事实,这可以通过以下方式完成:

yourtreepanel.getSelectionModel().on('selectionchange', whattodonext);

其中'yourtreepanel'是你的treepanel的名称(如果treepanel被分配给一个变量,否则使用Ext.getCmp('yourtreepanel').getSelecti ....)和'whattodonext'是函数的名称时调用用户选择一个节点。

函数“whattodonext”将如下所示:

    function whattodonext(){
        node=yourtreepanel.selModel.selNode;
        if(node){
            if(node.isLeaf()){
// this works out what you want to do if the user has selected a valid leaf node


            }else{
// otherwise...put anything you wish to happen here (i.e. if a folder has been selected)

            }

        }   
    }

下一部分是使用内容更新右侧的面板(如果它被称为“mycontentpanel”)。假设此内容应从“mycontent.html”加载,在与

// this works out what you want to do if the user has selected a valid leaf node

你会放代码:

mycontentpanel.load({
url: 'mycontent.html',
params: {
yourparam1:'param1value',
yourparam2:'param2value'
},
nocache: true,
timeout: 30
});

就是这样!

您可以使用 params 选项发送您可能拥有的任何特定 POST 参数,这些参数将决定提供哪些内容。

而且不要忘记,如果您遇到困难,请尝试使用 Ext.getCmp('objectname') 引用您的对象,而不仅仅是 'objectname'.operation....

祝你好运!

于 2010-08-24T10:59:50.667 回答