1. 首頁
  2. 問答
  3. 關於ExtJs4 MVC架構

關於ExtJs4 MVC架構

2011-11-04 39 views
0

我有以下的觀點來定義：關於ExtJs4 MVC架構

LeftNavigation（網格面板）

Ext.define('Ray.view.StationsList', { 
    extend: 'Ext.grid.Panel', 
    alias: 'widget.LeftNavigation', 

    store: 'LeftNavigation', 
    title: 'Navigation', 
    hideHeaders: true, 

    initComponent: function() { 
     this.columns = [{ 
      dataIndex: 'name', 
      flex: 1 
     }]; 

     this.callParent(); 
    } 
});

內容（面板）

Ext.define('Ray.view.Contents', { 
    extend: 'Ext.panel.Panel', 
    alias: 'widget.Contents' 
});

形式（晶型面板）

Ext.define('Ray.view.Form', { 
    extend: 'Ext.form.Panel', 
    alias: 'widget.Claim', 

    title: 'ClaimForm', 

    initComponent: function() { 
     this.items = [{ 
      xtype: 'form', 
      items: [{ 
       xtype: 'textfield', 
       name: 'name', 
       fieldLabel: 'Name' 
      }, { 
       xtype: 'textfield', 
       name: 'email', 
       fieldLabel: 'Email' 
      }] 
     }]; 

     this.buttons = [{ 
      text: 'Save', 
      action: 'save' 
     }]; 

     this.callParent(arguments); 
    } 

});

我想使用網格面板作爲導航，它的數據將來自一個JSON文件，這將有一個'ID'和'名稱'字段。其中id將作爲鏈接id和名稱作爲鏈接顯示的文本。

'內容'將是所有數據顯示的主要區域。在這種情況下，我有幾種形式，我需要在這裏顯示。所以我試圖在這裏實現的是，當用戶點擊導航網格上的特定鏈接時，我需要將與該鏈接的「id」相對應的表單加載到「內容」區域中。

我想弄清楚如何定義控制器或控制器來實現這一目標？

非常感謝，一個合適的答案將不勝感激。

來源

2011-11-04 hilarl

回答

2

這聽起來像你需要創建網格的itemclick事件的偵聽器，以確定哪些構成要加載。

在ExtJS中有許多訪問對象的方法，因此要遵循我的代碼示例，您需要爲每個組件分配id或itemId。另外，我不知道你的文件是如何構建的，所以你可能需要修改它以使其工作。但是，它應該爲控制器提供一個基礎。

Ext.define('Ray.controller.Stations', { 
    extend: 'Ext.app.Controller', 
    views: ['LeftNavigation', 'Contents', 'Claim'], 
    init: function() { 
     this.control({ 
      '#leftNavigationGrid': { 
       itemclick: this.onItemClick 
      } 
     }); 
    }, 
    onItemClick: function(grid, record) { 
     var id = record.data.id; 
     var myForm = Ext.widget('Claim', { width: 400; height: 600; }); 

     Ext.ComponentQuery().query('#Contents')[0].add(myForm); 
    } 
});

其原因Ext.ComponentQuery().query()後[0]是一個數組總是返回。由於我們確切知道我們（可能）得到的是單個對象，所以我們只需要返回數組中的第一個對象。

JordbaerHjelmen提到的整個MVC教程可能會從part 1開始，這對你來說真的很有用。

來源

2011-11-04 16:57:12

+0

非常感謝您的解釋。我不確定表單如何加載到容器中，如果你能解釋它，視圖'內容'將真正感謝它。 – hilarl

+0

我進入了更多的細節，將內容添加到內容面板。希望有所幫助！ –

相關問題

 相關問題