javascript - 动态地将具有表单的容器添加到另一个容器

Question

我创建了一个面板，其中左侧有一个列表，右侧有一个容器，您可以看到下图。

现在，当单击 Fruits 项时，我想在右侧加载一个表单，到目前为止，我已成功捕获列表项 Controller 中的 itemtap 事件，因为我正在使用 MVC 模式。

onMenuTap:function(me, index, target, record, e, eOpts){


     // here i want to dynamically load the existing container 
     // which contains the form

    }

我已经创建了一个表单，如下所示，文件名是 FruitForm.js 我想要 将这个现有容器添加到容器的右侧，我该怎么做？

Ext.define('market.view.FruitForm',{

    extend:'Ext.Container',
    xtype:'fruitform',
    requires:[
            'Ext.form.Panel'
        ],

    config:{

        items:[{

            xtype:'form',
            items:[{

                xtype:'fieldset',
                items:[{
                            xtype: 'textfield',
                            name: 'notitle',
                            label: 'Title:'
                        }]


            }]


        }]


    }



});

Answer 1

下面的代码应该可以工作:

(Add code to get right container).add({'xtype': 'fruitform'});

要获取容器，您可能必须使用类似以下内容的内容:

this.query('#Container_itemId')[0];