Extjs 4 - 組合兩個網格列

Question

我有一個數據存儲和一個網格。我正在嘗試聲明一個名爲FullName的新列，它將結合兩個數據索引。花了一些時間研究這個問題後，我明白它可以是渲染器（網格級），也可以是數據存儲區中的自定義列（映射？）。

有人可以提供一個代碼示例，實現這樣的列？

// XML 
<person> 
    <first_name>John</first_name> 
    <last_name>Smith</last_name> 
</person> 

// Store 
Ext.create('Ext.data.Store', { 
    autoLoad: true, 
    storeId: 'TestStore', 
    fields: ['first_name', 'last_name'], 
    data: parsed_xml_object, 
    proxy: { 
     type: 'memory', 
     reader: { 
      type: 'xml', 
      record: 'person' 
     } 
    } 
}); 

// Grid 
TestGrid = Ext.create('Ext.grid.Panel', { 
    title: 'Test', 
    store: Ext.data.StoreManager.lookup('TestStore'), 
    columns: [ 
     { header: 'First Name', dataIndex: 'first_name' }, 
     { header: 'Last Name Name', dataIndex: 'last_name' }, 
    ], 
    height: 200, 
    autowidth: true 
}); 

Answer 1

使用自定義渲染：

{ 
    header: "Name", 
    dataIndex: 'last_name', 
    renderer: function(value, p, r) { 
     return r.data['last_name'] + ', ' + r.data['first_name']; 
    } 
} 

Answer 2

你可以使用templeteColumn它是一個列定義類，其利用配置XTemplate

http://docs.sencha.com/ext-js/4-0/#/api/Ext.grid.column.Template

處理模型的數據呈現一個值