Ext JS的电网

Question

我有一个Ext JS的网格象下面这样：

var grid = new Ext.grid.GridPanel({ 
columns: [ 
{header: 'Account Id',dataIndex:'accountId' }, 
{header: 'Account NUmber',dataIndex:'accountNumber' } 
] 
}) 

现在我需要显示账户ID列单选按钮的一列。所以从网格用户可以选择一个帐户ID并提交。当用户重新加载页面时，应该预先选择该帐户ID。

我需要一些帮助，了解如何进行此操作。我是否需要在Account Id列上编写渲染器？或者有更简单的方法。

编辑：我确实是这样的：

{header: 'Account Id',dataIndex:'accountId',renderer: function(value) { 
return "<input type='radio' name = 'primaryRadio' " + (value ? "checked='checked'" : "") + ">"; 
}}, 

什么是添加一个onclick事件或onchange事件到无线电集团的语法？

Answer 1

通过使用渲染器函数，您可以很好地将Account Id列显示为单选按钮列。

关于这些onclick事件，你可以简单地添加onclick属性的HTML标签：

return "<input onclick='my_function()' type='radio' name = 'primaryRadio' " + (value ? "checked='checked'" : "") + ">"; 

Answer 2

建设掉以前的答案，是的，我想用渲染你的列是正确的解决方案。我认为你应该去点击事件比J.布鲁尼建议的不同。我建议你的网格面板上的点击监听器检查你是否点击了一个单选按钮，并委托给GridPanel中的一个方法。

事情是这样的：

MyRadioGrid = Ext.extend(Ext.grid.GridPanel, { 
    columns: [ 
     {header: 'Account Id',dataIndex:'accountId', renderer: function(value) { 
      return "<input type='radio' name = 'primaryRadio' " + (value ? "checked='checked'" : "") + ">"; 
     }}, 
     {header: 'Account NUmber',dataIndex:'accountNumber' } 
    ], 

    afterRender: function() { 
     MyRadioGrid.superclass.afterRender.apply(this, arguments); 
     this.el.on('click', this.checkRadioClick, this); 
    }, 

    checkRadioClick: function(event) { 
     if (event.getTarget('input[type="radio"]')) { 
      //radio clicked... do something 
     } 
    } 
});