vendredi 29 juillet 2016

Extjs: Mask component for modal window

I need to create a modal window in the other normal window. When I create a modal window is blocked mask.

Ext.application({
name : 'Fiddle',

launch : function() {
    var win2 = null;

    var win1 = Ext.create('Ext.window.Window', {
        closeAction: 'hide',
        width: 500,
        height: 500,
        resizable: false,
        titleAlign: 'center',
        items: {
            xtype: 'button',
            text: 'show modal',
            handler: function() {win2.show()}
        },
        title: 'Simple window'
    });

    Ext.create('Ext.panel.Panel', {
        items: {
            xtype: 'button',
            text: 'show window',
            handler: function() {
                var isRendered = win1.rendered;
                win1.show(null, function() {
                    if (!isRendered) {
                        win2 = Ext.create('Ext.window.Window', {
                            closeAction: 'hide',
                            resizable: false,
                            titleAlign: 'center',
                            width: 200,
                            height: 200,
                            renderTo: win1.getEl(),
                            modal: true,
                            title: 'Modal window'
                        })
                    }
                });
            }
        },
        renderTo: Ext.getBody()
    });
}});

z-index is right:

  • Mask component is 19006
  • Modal window component is 19010
  • Simple window component is 19000

I don't understand where I was wrong.

Aucun commentaire:

Enregistrer un commentaire