8

Microsoft OS (xp、vista、7 など) のウィンドウのように...

メイン ウィンドウがモーダル ウィンドウを作成する場合、ユーザーはメイン ウィンドウにアクセスできません
(ツールバーを閉じてアクセスするなどを含む)。

extjsで似たようなものを作りたいです。これは私のモーダルの例です:

Ext.create("Ext.Window", {
    title: 'aa',
    width: 200,
    height: 150,
    html: 'a',
    tbar: [{
        text: 'aa',
        handler: function() {
            Ext.create("Ext.Window", {
                title: 'aa',
                width: 150,
                closable: false,
                height: 100,
                html: 'b',
                ownerCt: this,
                modal: true
            }).show();
        }
    }]
}).show();

問題は、メイン ウィンドウの本体を無効にするだけで、ユーザーは引き続きメイン ツールバーにアクセスでき、それを閉じることもできます。

私の質問は、フルモーダルを作成する方法ですか? または、それができない場合、メインウィンドウを無効にする方法、モーダルウィンドウが表示されている場合、モーダルウィンでリスナーショーを使用していますが、問題はこのリスナーからメインウィンドウにアクセスできないことです。

編集 :

これはこれまでの私のコードです:

Ext.create("Ext.Window", {
    title: 'aa',
    width: 200,
    height: 150,
    html: 'a',
    maskOnDisable: false,
    tbar: [{
        text: 'aa',
        handler: function(a) {
            var parent = a.up("window");
            parent.disable();
            Ext.create("Ext.Window", {
                title: 'aa',
                width: 150,
                height: 100,
                html: 'b',
                listeners: {
                    scope: this,
                    "close": function() {
                        parent.enable();
                    },
                    /*
                    "blur" : function(){
                        this.focus()
                    }
                    */
                }
            }).show();
        }
    }]
}).show();

これはモーダルの概念ではありませんが、今欲しいもののように思えますが、新しい問題maskOnDisableがあり、機能せず、のようなイベントが必要なblurので、ユーザーが親ウィンドウをクリックすると、ポップアップ ウィンドウに戻ります。(新しい質問として投稿する必要がありますか?)

4

2 に答える 2

25

最近は modal: true を設定します

Ext.define('myApp.view.MyModalWindow', {
extend: 'Ext.window.Window',
...
modal: true,
...
于 2013-01-25T14:54:17.393 に答える
9

新しい答え:

親ウィンドウを適切に作成しようとしましdisable()たか?enable()これは、最初のウィンドウへのアクセスを停止すると同時に、ユーザーがメインのアプリケーションメニューと画面にアクセスできるようにするのに役立つと思います。これが私が試したことです:

var x = Ext.create("Ext.Window",{
    title : 'aa',
    width : 200,
    height: 150,
    html : 'a',
    tbar : [{
        text : 'aa' ,
        handler :function(){
            // I disable the parent window.
            x.disable();

            Ext.create("Ext.Window",{                   
                title : 'aa',
                width : 150,
                closable : false,
                height: 100,
                html : 'b'
                // You will need to enable the parent window in close handler of this window.

            }).show();
        }
    }]
}).show();

ウィンドウを無効にすると、ウィンドウ内のコンポーネントが無効になり、ウィンドウを移動することもできなくなります。ただし、同時に、メインメニューやページ上のグリッドなどの他のコンポーネントにもアクセスできます。新しいウィンドウにもアクセスできます。ここで、モーダルのように動作させるには、子ウィンドウを閉じるときに親ウィンドウを有効にする必要があります。そのための方法を利用することができますenable()

私はあなたが探しているものを達成するための他の方法を考えることはできません。


古い答え:

なぜownerCtウィンドウ自体を参照してプロパティを設定したのだろうか。それがあなたの主な問題です。プロパティを削除することにより、あなたが探しているものを達成します。更新されたコードは次のとおりです。

Ext.create("Ext.Window",{
    title : 'Extra window!',
    width : 150,                            
    height: 100,
    closable : false,                           
    html : 'A window that is a modal!',                         
    modal : true
}).show();

ownerCtプロパティを設定する理由はありましたか?

于 2011-05-19T05:14:24.033 に答える