簡體   English   中英

ExtJs 4-當可關閉屬性進行動態更新時,如何更新Ext.window.Window布局?

[英]ExtJs 4 - How to update Ext.window.Window layout when closable property was updated dinamically?

我遇到了主題中描述的問題。 我有ExtJs應用程序。 我的任務顯示帶有填充網格的彈出窗口。 默認情況下window.closable = false;

我在控制器的某個位置定義了窗口,看起來像這樣:

Ext.define('Return.controller.ViewportController', {
  extend: 'Ext.app.Controller',
  views:[
    'ModalWindow',
    'ProductsList'
  ],

  stores:[
    ...,
    'ProductsStore'
  ],

  models:[
    ...,
    'ProductsModel'
  ],


  resultWindow: Ext.create('Ext.window.Window', {
    itemId: 'popupWindow',
    id: 'popupWindow',
    title: 'Result List',
    layout:'fit',
    width: 900,
    height: 600,
    modal: true,
    closable: false,
    closeAction: 'hide',
    items:[]
  })


  onPopupShow: function() {
    // first add grid with store to popup window;
    // then need to load data into ProductsStore;
    // depending on values in store_stock column need to define
    // if I should show close button for Window or not.
    // By default button is invisible
    var prodStore = Ext.getStore('ProductsStore');
    this.resultWindow.add({xtype: 'ProductsList', border: true});
    prodStore.load({
      params: {
        stock_locations_id: 1,
        query: value
      },
      callback: function (result) {
        var app = this;
        if (result.length > 0) {
          //make window closable
          app.resultWindow.closable = (!prodStore.sum('stock'));
          //show and update Layout
          app.resultWindow.show().updateLayout();
          Ext.getCmp('ProductsList').getView().refresh();
          return;
        }
        //do smth else
      }, scope: this
    });
  }
);

用戶應執行以下操作:在popupShow上,找到網格中的任何行,然后單擊它。 之后,該彈出窗口將被隱藏,並且選定的行將與所有數據一起添加到父網格。

prodStore.sum('stock') -表示列中所有值的總和prodStore.sum('stock')它工作正常。 'stock'列中的所有值均為零時,用戶應該只能關閉窗口。

當我調試那段代碼時,窗口將closable屬性設置為true並可以顯示。 但是在正常運行中-不。 嘗試同時檢入控制台Ext.getCmp('popupWidow').closable它根據需要返回true

我想應該更新布局。 我在顯示窗口后立即執行此操作。 但不幸的是。

還有什么其他方法適用?

提前致謝。

創建resultWindow對象中的callback函數,並設置了closable性能,同時對其進行初始化。

因此,您可以執行以下操作:

Ext.define('Return.controller.ViewportController', {
  extend: 'Ext.app.Controller',

  ...

 resultWindowConfig: {
   itemId: 'popupWindow',
   id: 'popupWindow',
   title: 'Result List',
   layout:'fit',
   width: 900,
   height: 600,
   modal: true,
   closable: false,
   closeAction: 'hide',
   items:[]
 },

 onPopupShow: function() {
   ...
   scope: this,
   callback: function (result) {
     var app = this;
     if (result.length > 0) {
      //make window closable
      app.resultWindowConfig.closable = (!prodStore.sum('stock'));

      var resultWindow = Ext.create('Ext.window.Window', app.resultWindowConfig);

      //If you want to set resultWindow as a property of the app object just do app.resultWindow = resultWindow;
      resultWindow.show();

      ...
      return;
     }
  });
});

如果查看Ext.window.Window文檔,您會發現此屬性沒有設置函數,這意味着您不能僅通過更改此屬性來更新UI。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM