2016-11-14 14 views
1

この関数onDisplayErrorは、リクエストが失敗したときに毎回呼び出されます。これは、ユーザーが保存ボタンを押して3つの要求が失敗している場合、現在3つのポップアップメッセージが表示されていることを意味します。私の目標は、この関数が自分のポップアップウィンドウが既に開いているかどうかをチェックすることです。それがあるならば、私は私が既に窓を開けにそれ以外の場合は、このエラーのポップアップに1つだけのポップアップウィンドウ(パネル)を開く

onDisplayError: function (response, message) { 
     var errorPanel = Ext.create('myApp.view.popup.error.Panel',{ 
      shortMessage: message, 
      trace: response 
     }); 
     if(errorPanel.rendered == true){ 
      console.log('Do some other stuff'); 
     }else{ 
      errorPanel.show(); 
     } 
    }, 

を開く必要があります。これは、問題は、私はまだ複数のポップアップを取得していますということですPanel.js

Ext.define('myApp.view.popup.error.Panel', { 
    extend: 'Ext.panel.Panel', 
    requires: [ 
     'myApp.view.popup.error.PanelController' 
    ], 
    controller: 'myApp_view_popup_error_PanelController', 

    title: 'Fail', 
    glyph: '[email protected]', 

    floating: true, 
    draggable: true, 
    modal: true, 
    closable: true, 
    buttonAlign: 'center', 
    layout: 'border', 
    shortMessage: false, 
    width: 800, 
    height: 200, 

    initComponent: function() { 
     this.items = [ 
      this.getMessagePanel(), 
      this.getDetailsPanel() 
     ]; 
     this.callParent(arguments); 
    }, 

    getMessagePanel: function() { 
     if(!this.messagePanel) { 
      var message = this.shortMessage; 
      this.messagePanel = Ext.create('Ext.panel.Panel', { 
       bodyPadding: 5, 
       height: 200, 
       region: 'center', 
       border: false, 
       html: message 
      }); 
     } 
     return this.messagePanel; 
    }, 

    getDetailsPanel: function() { 
     if(!this.detailsPanel) { 
      this.detailsPanel = Ext.create('Ext.panel.Panel', { 
       title: 'Details', 
       hidden: true, 
       region: 'south', 
       scrollable: true, 
       bodyPadding: 5, 
       height: 400, 
       html: '<pre>' + JSON.stringify(this.trace, null, 4) + '</pre>' 
      }); 
     } 
     return this.detailsPanel; 
    } 

でエラーを追加します表示されます。私は問題はvar errorPanelが参照を失うので、このポップアップ(パネル)が既に開かれているかどうかをチェックできないと思います。どのように望ましい効果を達成するには?私はextjs 6と一緒に働いています。追加情報が必要な場合は、私に知らせてください。

答えて

2

あなたのコンポーネント定義の特別なxtypeに提供することができ

Ext.define('myApp.view.popup.error.Panel', { 
    extend: 'Ext.panel.Panel', 
    xtype:'myxtype' 

とあなたは非常に凝縮onDisplayError機能可能性があり、その後:

onDisplayError: function (response, message) { 
    var errorPanel = Ext.ComponentQuery.query('myxtype')[0] || Ext.widget('myxtype'); 
    errorPanel.appendError(message, response) 
    errorPanel.show(); 
}, 

をパネルのinitComponent関数は空のウィンドウを初期化しなければならない、とappendErrorは最初のエラーの可能性があり、エラー(などを追加するために、あなたのロジックを含める必要があります2番目または3番目)をパネルのエラーリストに追加します。

+0

素晴らしい!ありがとうございました! –

2

Ext.createを使用すると、常にそのクラスの新しいインスタンスが作成されます。

参照設定を使用して、パネルへの一意の参照を作成できます。 次に、コントローラーのthis.lookupReference( 'referenceName')を使用して、パネルがすでに存在するかどうかを確認し、show()を確認します。

閉じるときにパネルが破損するのを防ぐには、パネル内にcloseAction: 'hide'を設定する必要があります。

そうしないと、あなたは、その後....コントローラ

this.errorPanel = Ext.create( 'myApp.view.popup.error.Panel' に

をパネルへの参照を保存することができます(this.errorPanel)this.errorPanel.show()場合は、 他this.errorPanel = Ext.create ...

関連する問題