我是ExtJs的新手,我试图以这种方式显示复选框组 grid 我有以下代码 Ext.onReady(function() {var ct = Ext.create('Ext.container.Viewport', { layout: 'border', defaults: { collapsible: true, split: true }, items: [{ title:
grid
我有以下代码
Ext.onReady(function() { var ct = Ext.create('Ext.container.Viewport', { layout: 'border', defaults: { collapsible: true, split: true }, items: [{ title: 'Tasks', region: 'west', margins: '5 0 0 0', cmargins: '5 5 0 0', width: '50%', scrollable: true, bodyStyle: 'padding:10px', html: MyTest.description },{ collapsible: false, region: 'center', margins: '5 0 0 0', items: [{ xtype: 'grid', id: 'MyGridPanel', title: 'Test Grid', store: { fields: ['name', 'permissions'], proxy: { type: 'memory', reader: {type: 'json'} }, data: [{ name: 'Farms', permissions:{ 'manage': 1, 'clone': 1, 'launch': 0, 'terminate': 0, 'not-owned-farms': 0 } },{ name: 'Alerts', permissions:null },{ name: 'Servers', permissions:null },{ name: 'Events and notifications', permissions:null },{ name: 'Statistics', permissions:null },{ name: 'Roles', permissions:{ 'manage':1, 'clone':0, 'bundletasks':0 } },{ name: 'Scripts', permissions:{ 'manage':0, 'execute':0, 'fork':0 } }] }, columns: [{ text: 'Name', width: 200, dataIndex: 'name' },{ text: 'Permissions', dataIndex: 'permissions', // I need to insert here a checkbox groups for elements that have permissions I guess. So what should I use here - renderer, handle? }], }] }] });
那我应该用什么呢?例如,如果我使用渲染器(不确定是否可以使用它),我可以收到复选框的所有数据(参见下面的代码),但我不知道如何渲染它.
renderer: function(value, meta, rec, rowIdx, colIdx, store, view) { var checkboxconfigs = []; for (var variable in value) { checkboxconfigs.push({ boxLabel: variable, name: variable, inputValue: value[variable], checked: value[variable] }) } var checkboxes = new Ext.form.CheckboxGroup({ id:'chkGroup', fieldLabel: 'Permissions', columns: 1, items: checkboxconfigs }); // return WHAT?; }
我很感激你的帮助!
解:如果要渲染值,请尝试使用此列定义:
{ text: 'Permissions', dataIndex: 'permissions', width: 200, renderer: function(value, cell) { var s = ''; for (var index in value) { s = s + '<input type="checkbox" '; if (value[index] == 1) { s = s + 'checked'; }; s = s + '>' + index; } return s; } }
笔记:
用ExtJS 4.2测试.