ExtJS 4:菜单中的下拉按钮故障

我有一些元素（第二个下拉按钮）在下拉按钮菜单面板。 当我点击第二个下拉按钮时，主菜单关闭。 这是我的密码：

创建第一级下拉按钮

    Ext.onReady(function () {
        Ext.create('Ext.Button', {
            text: 'Click me',
            margin: 10,
            renderTo: Ext.getBody(),
            menu: getMenu()
        });
    });

    function getSecondElement() {
        return Ext.create('Ext.Button', {
            text: 'Select',
            menu: Ext.create('Ext.menu.Menu', {
                plain: true,
                items: [
                    Ext.create('Ext.panel.Panel', {
                        width: 500,
                        height: 100,
                        bodyPadding: 5,
                        items: [
                            {
                                html: '1'
                            },
                            {
                                html: '2'
                            }
                        ]
                    })
                ]
            })
        });
    }

第一层的Cretae菜单

    function getMenu() {
        return Ext.create('Ext.menu.Menu', {
            plain: true,
            items: [
                Ext.create('Ext.panel.Panel', {
                    width: 500,
                    height: 100,
                    bodyPadding: 5,
                    items: [
                        getFirstElement(),
                        getSecondElement()
                    ]
                })
            ]
        });
    }

创建一些元素

    function getFirstElement() {
        return Ext.create('Ext.form.field.Date', {
            fieldLabel: 'Date',
            value: null,
            labelWidth: 50,
            width: 150,
            padding: 5
        });
    }

创建第二级下拉按钮

    Ext.onReady(function () {
        Ext.create('Ext.Button', {
            text: 'Click me',
            margin: 10,
            renderTo: Ext.getBody(),
            menu: getMenu()
        });
    });

    function getSecondElement() {
        return Ext.create('Ext.Button', {
            text: 'Select',
            menu: Ext.create('Ext.menu.Menu', {
                plain: true,
                items: [
                    Ext.create('Ext.panel.Panel', {
                        width: 500,
                        height: 100,
                        bodyPadding: 5,
                        items: [
                            {
                                html: '1'
                            },
                            {
                                html: '2'
                            }
                        ]
                    })
                ]
            })
        });
    }

---

有什么想法吗？

菜单上有一个名为

allowOtherMenus

的配置选项。将其设置为true将允许其他菜单与设置了配置选项的菜单同时显示

因此，getSecondElement函数变为：

function getSecondElement() {
        return Ext.create('Ext.Button', {
            text: 'Select',
            menu: Ext.create('Ext.menu.Menu', {                
                allowOtherMenus: true,
                plain: true,
                items: [
                    Ext.create('Ext.panel.Panel', {
                        width: 500,
                        height: 100,
                        bodyPadding: 5,
                        items: [
                            {
                                html: '1'
                            },
                            {
                                html: '2'
                            }
                        ]
                    })
                ]
            })
        });
    }

您使用多个菜单的示例可以在以下JSFIDLE中找到：

有关该财产的文件可在Sencha中找到