在网格单元格中的 extjs 中，我必须显示字符串数组中的值列表，该字符串数组是记录的一部分

Posted 2023-02-26

【中文标题】在网格单元格中的 extjs 中，我必须显示字符串数组中的值列表，该字符串数组是记录的一部分

【英文标题】：In extjs in grid cell i have to display list of values from an string array which is part of a record

【发布时间】：2014-04-13 17:21:44

【问题描述】：

在网格单元格中的 extjs 中，我必须显示如下数据：

FirstName  LastName   Department   UserId

Jhon       Peter      Finance      8345    
                      Facilities
                      Social


I am going to get data like this

<FirstName>Jhon</FirstName>
<LastName>Peter</LastName>
<Department>
<string>Finance</string>
<string>Facilities</string>
<string>Social</string>
</Department>
<UserId>8345</UserId>

部门数组是来自服务的数据记录的一部分。我必须在网格单元格中一个接一个地显示部门数组值。此部门数组值因用户而异。

谁能分享一个例子如何在 extjs 中做到这一点。

【参考方案1】：

您可以使用Ext.grid.column.Template 类。

// I took example from Sencha Doc
Ext.create('Ext.data.Store', 
    storeId:'employeeStore',
    fields:['firstname', 'lastname', 'seniority', 'department'],
    groupField: 'department',
    data:[
         firstname: "Michael", lastname: "Scott",   seniority: 7, department: "Management" ,
         firstname: "Dwight",  lastname: "Schrute", seniority: 2, department: "Sales" ,
         firstname: "Jim",     lastname: "Halpert", seniority: 3, department: "Sales" ,
         firstname: "Kevin",   lastname: "Malone",  seniority: 4, department: "Accounting" ,
         firstname: "Angela",  lastname: "Martin",  seniority: 5, department: "Accounting" 
    ]
);

Ext.create('Ext.grid.Panel', 
    title: 'Column Template Demo',
    store: Ext.data.StoreManager.lookup('employeeStore'),
    /**
     * here, you can define your template by 'tpl' property.
     * 'firstname' and 'lastname' comes from store definition
     */
    columns: [
         text: 'Full Name',       xtype: 'templatecolumn', tpl: 'firstname lastname', flex:1 ,
         text: 'Department (Yrs)', xtype: 'templatecolumn', tpl: 'department (seniority)' 
    ],
    height: 200,
    width: 300,
    renderTo: Ext.getBody()
);