web-dev-qa-db-ja.com

loadMask（）をextjsの単一の要素に適用しますか？

LoadMaskをブラウザの幅と高さ全体ではなく、1つの要素にのみ適用するにはどうすればよいですか？

デフォルト
enter image description here



ここでは、1つの要素のみがマスクされ、messageBoxは中央にあり、この要素の内側にあり、表示全体ではありません。
enter image description here


何か案は？

編集：

@Molecule、ありがとう、しかしこれはデータが何らかのソースからロードされているときです、私が必要とするのは：

{
    xtype:"button",
    text:"Alert",
    handler: function(){

        Ext.Msg.show({
        title:'Save Changes?',
        msg: 'You are closing ?',
        buttons: Ext.Msg.YES,
        setLoading: // here somehow only mask parent element, and position alertBox...
    }

}
loadextjs4extjsmask
12
Davor Zubak

すべてのコンポーネントには、独自のloadMaskプロパティがあります。 _YourComponent.setLoading_を呼び出すことで使用できます。これが フィドル 私が話していることを説明するためです。

別の方法は、new Ext.LoadMask(YourComponent.el, {msg:"Please wait..."});を使用することです。私の フィドル で使用法を見ることができます。

[〜＃〜]更新[〜＃〜]

ExtJS4loadMaskとMessageBoxを指定されたウィジェットに適用する方法を示すコード例を次に示します。

_Ext.create('Ext.panel.Panel', {
    width: 600,
    height: 400,
    title: 'Border Layout',
    layout: 'border',
    items: [{
        title: 'West Region is collapsible',
        region:'west',
        xtype: 'panel',
        width: 400,
        id: 'west-region-container',
        layout: 'fit'
    },{
        title: 'Center Region',
        region: 'center',
        xtype: 'panel',
        layout: 'fit',
    }],
    renderTo: Ext.getBody()
});
var myMask = new Ext.LoadMask(Ext.getCmp('west-region-container').el, {useMsg: false});
myMask.show();
var msg = Ext.Msg.show({
    title:'Save Changes?',
    msg: 'Bla-Bla',
    buttons: Ext.Msg.OK,
    modal: false
});
msg.alignTo(Ext.getCmp('west-region-container').el, 'c-c');
_

そしてここに try-it-yourselfの例 があります。

29
Molecular Man