如何在网格 extjs 中正确应用单选按钮？

Question

我在当地工作。我使用了一个函数来显示网格内的单选按钮，然后我在 renderer 中调用了该函数。我知道这是不对的，这只是为了让你看到我想要的。

我不知道如何为每一行应用单选按钮。

我使用的是 extjs 3.4。

对不起我的英语和混乱。

这是数组：

var data_metas =    [['INGRESE META N°1','','','','','','100%','100%'],
                     ['INGRESE META N°2','','','','','','100%','100%'],
                     ['INGRESE META N°3','','','','','','100%','100%']];

这是 ArrayStore：

var store_grid_metas = new Ext.data.ArrayStore({
                  fields: [
                     {name: 'Meta'},
                     {name: '100%'},
                     {name: '75%'},
                     {name: '50%'},
                     {name: '25%'},
                     {name: '0%'},
                     {name: 'Ponderación'},
                     {name: 'Nota final'}
                  ]
});

store_grid_metas.loadData(data_metas);

"radiogrid"函数：

function radiogrid (value) {
return "<input type='radio' name = 'primaryRadioMetaUno' " + (value ? "checked='checked'" : "") + ">";
}

这是网格：

var grid_metas = new Ext.grid.GridPanel({

            store       : store_grid_metas,
            id          : 'grid_metas',
            stripeRows  : true,
            height      :  500,
            width       : '100%',
            autoScroll  : true,
            frame       : true,
            border      : true,
            columnLines : true,
            stateful    : true,
            clicksToEdit: 1,
            items: [{

                                xtype: 'button',
                                itemId: 'btn_guardar_meta',
                                icon: '../../icons/add.png',
                                scale: 'small',
                                text: '<b>INGRESAR METAS</b>',
                                handler: function(){

                                      //modal_agregar_metas();

                                }
                  }],

            columns:[{ 
                      xtype: 'gridcolumn',
                      dataIndex: 'Meta',name: '',
                      header: 'Meta',
                      sortable: true,
                      grupable:true,
                      width: 400,                    
                  },{ 
                      xtype: 'gridcolumn',
                      dataIndex: '100%',name: '',
                      header: '100%',
                      sortable: true,
                      grupable:true,
                      align: 'center',
                      width: 50,
                      renderer : radiogrid               
                  },{ 
                      xtype: 'gridcolumn',
                      dataIndex: '75%',name: '',
                      header: '75%',
                      sortable: true,
                      grupable:true,
                      align: 'center',
                      width: 50,
                      renderer : radiogrid
                  },{ 
                    xtype: 'gridcolumn',
                      dataIndex: '50%',name: '',
                      header: '50%',
                      sortable: true,
                      grupable:true,
                      align: 'center',
                      width: 50,
                      renderer : radiogrid
                  },{ 
                      xtype: 'gridcolumn',
                      dataIndex: '25%',name: '',
                      header: '25%',
                      sortable: true,
                      grupable:true,
                      align: 'center',
                      width: 50,
                      renderer : radiogrid
                  },{ 
                      xtype: 'gridcolumn',
                      dataIndex: '0%',name: '',
                      header: '0%',
                      sortable: true,
                      grupable:true,
                      align: 'center',
                      width: 50,
                      renderer : radiogrid
                  },{ 
                      xtype: 'gridcolumn',
                      dataIndex: 'Ponderación',name: '',
                      header: 'Ponderación',
                      sortable: true,
                      grupable:true,
                      width: 150
                  },{ 
                      xtype: 'gridcolumn',
                      dataIndex: 'Nota final',name: '',
                      header: 'Nota final',
                      sortable: true,
                      grupable:true,
                      width: 150
                  }],


})

代码显示如下：

Answer 1

也许在处理 cellclick 事件的网格上尝试一个侦听器。使用 Ext 传递给此处理程序的参数，您可以访问存储记录以根据需要设置或获取值：

function(grid, rowIndex, columnIndex, e) {
    var record = grid.getStore().getAt(rowIndex);  // Get the Record
    var fieldName = grid.getColumnModel().getDataIndex(columnIndex); // Get field name
    var data = record.get(fieldName);
}

如何在网格 extjs 中正确应用单选按钮？

How can I apply correctly a radio button in a grid extjs?

extjs

grid

radio-button

extjs3

gridpanel