Question

现在正在努力解决一两天的问题。我有一个包含2个组合框的Ext.Window。在第一次加载时一切正常，两个商店都已填充，组合的工作正常。

但是，如果我第二次.show（）窗口，组合框不会“下拉”以显示列表。我已经检查过Firebug，虽然正在填充商店，但没有任何条目被添加到组合框中。

以下是Window的代码：

uTransferWindow = new Ext.Window({
                id              : 'windowUserLicenseTransfer',
                title           : 'Title',
                width           : 405,
                autoScroll      : true,
                closeAction     : 'hide',
                closable        : false,
                modal           : true,
                bodyStyle       : 'background-color:#FFF',
                buttonAlign     : 'center',
                items           : new Ext.form.FormPanel({
                    labelAlign      : 'left',
                    labelWidth      : 140,
                    bodyStyle       : 'padding:10px 10px 0 10px',
                    border          : false,
                    defaults: {
                        xtype: 'ComboBox',
                        anchor: '100%',
                        tpl: '<tpl for="."><div class="x-combo-list-item"><div style="position:absolute;left:4px;">{initials}</div><div style="position:relative;left:50px;">{username}</div></div></tpl>',
                        displayField: 'username',
                        valueField: 'userid',
                        typeAhead: true,
                        mode: 'local',
                        triggerAction: 'all'
                    },
                    items: [{
                        hiddenName: 'fromuserid',
                        fieldLabel: 'From User',
                        id          : 'drop1',
                        store: userswithlicenses
                    }, {
                        hiddenName: 'touserid',
                        fieldLabel: 'To User',
                        id          : 'drop2',
                        store: userswithoutlicenses
                    }]
                }),
                buttons     : [{
                    text        : 'Transfer License',
                    handler     : function() {
                        //do stuff
                    }
                }, {
                    text: 'Cancel',
                    handler: function() { uTransferWindow.hide(); }
                }]
            }),

我在论坛上找不到其他有类似问题的人，我们将不胜感激。

UPDATE：虽然发现了一些小的东西：当显示Window时，第二次z-index确实增加了。为什么每次显示窗口时z-index都会增加？

Answer 1

确保你没有多次调用新的Ext.Window - 因为你正在隐藏窗口而不是破坏如果你使用相同的配置调用new，那么组合框的id会发生冲突并且你有你的行为描述。

Answer 2

我有同样的问题，这是一个z索引问题（firebug显示了这种情况）。组合的列表不包含在窗口的div中，因此窗口的z-index更改不会级联到列表视图。无论如何，我没有注意到每当我显示它时窗口都会更新其z-index，但是后续打开的窗口会获得更高的z-index。这是我收到问题，打开多个窗口。

在我的情况下，我扩展了Ext.Window并在任何地方使用了该扩展，所以我只是在我的扩展内部的initComponent中放置了一个“beforeshow”监听器，如下所示：

    initComponent: function(){
   ... // I put the listener as the last line
   this.on("beforeshow", this.fixComboDropdowns, this);

},
/**
 * When opening multiple windows within an application, combo box list values' zIndex
 * can become out-of-sync and cause the list to not show its values.  This
 * method is to help prevent that from occurring.
 */
fixComboDropdowns: function(win){
    try{
        var zIndex = parseInt(win.getEl().getStyle("z-index"));
        // retrieve the combo boxes contained in this window.
        // call each combo boxes' getListParent() method, and set the list parent's zindex.
        var combos = win.findByType("combo");
        if(combos && combos.length > 0){
            if(WINDOW_ZINDEX === 0 || WINDOW_ZINDEX < zIndex){
                WINDOW_ZINDEX = zIndex + 100;
            }
            else{
                WINDOW_ZINDEX = WINDOW_ZINDEX + 100;
            }

            for(var index = 0; index < combos.length; index = index + 1){
                // set each combo's z-index style:
                var combo = combos[index];
                var listEl = combos[index].getListParent();
                if(listEl && listEl.style){
                    listEl.style.zIndex = WINDOW_ZINDEX + 10; // make sure the combo's list will display.
                }
            }
        }
    }catch(ex){
        if(console){
            console.error(ex);
        }
    }
    return true;
}

哦，别忘了定义全局WINDOW_ZINDEX变量，如下所示： var WINDOW_ZINDEX = 0;

我确信上面的代码可以改进，但你会得到一般的想法。我无法验证的一些项目： 1）。如果弹出窗口将焦点设置在字段上怎么办？以上是否删除了焦点？

如果你没有Ext.Window的覆盖，那么考虑使用工厂模式，在那里你可以创建Ext.Window，然后在它之前放置“beforeshow”监听器，然后再将它返回给调用者。

如果工厂模式不是一个选项，那么考虑在Ext.Window的beforeShow方法上放置一个拦截器，或者覆盖它。

Answer 3

您最好不要显示/隐藏窗口，而是创建一个新窗口并在需要时将其关闭。这可以通过使用Ext.extend来实现，例如

TransferWindow = Ext.extend(Ext.Window, {
/*Lots of code*/
});

// some time later.

var uTransferWindow = new TransferWindow();
uTransferWindow.show();

我确信这种方法有助于解决您遇到的问题，并保留html代码以防止隐藏窗口。

P.S。您还可以考虑使用名称空间（Ext.namespace）。

组合框不显示第二次加载窗口时的记录

3 个答案: