在ExtJs中添加按钮到网格

Question

我是ExtJS的新手.

有没有人知道如何在ExtJS中为每一行网格添加按钮？

请举个例子.

谢谢

Answer 1

你可以在这里查看,希望它有所帮助!

http://techmix.net/blog/2010/11/25/add-button-to-extjs-gridpanel-cell-using-renderer/

Answer 2

Actualy Ext.Buttons在行单元格中,据我所知,使用Ext的当前设置是不可能的.当然,实际上可以在单元格的div中呈现按钮的HTML,但实际上我认为这是一个坏主意.

更好的方法是实现Saki的rowactions插件,这使得向每行添加按钮/动作变得非常容易.

http://rowactions.extjs.eu/

Answer 3

您应该使用自定义渲染器，但我建议您使用工具栏按钮而不是更干净。

如果您想在此处获得更多参考，请参阅 ColumnModel 类的文档。

无论如何它会给出类似的东西

 var grid = new Ext.grid.GridPanel({
     store: store,
     columns: [{
         id: 'company',
         header: 'Company',
         width: 160,
         sortable: true,
         dataIndex: 'company'
     }, {
         header: 'Price',
         width: 75,
         sortable: true,
         renderer: 'usMoney',
         dataIndex: 'price'
     }, {
         header: 'Change',
         width: 75,
         sortable: true,
         renderer: change,
         dataIndex: 'change'
     }, {
         header: '% Change',
         width: 75,
         sortable: true,
         renderer: pctChange,
         dataIndex: 'pctChange'
     }, {
         header: 'Last Updated',
         width: 85,
         sortable: true,
         renderer: Ext.util.Format.dateRenderer('m/d/Y'),
         dataIndex: 'lastChange'
     }, {
         header: 'action',
         width: 85,
         sortable: false,
         renderer: function(val) {
             return '<input type="button" value="toto" id="' + val + '"/>';
         },
         dataIndex: 'somefieldofyourstore'
     }],
     stripeRows: true,
     autoExpandColumn: 'company',
     height: 350,
     width: 600,
     title: 'Array Grid',
     // config options for stateful behavior
     stateful: true,
     stateId: 'grid'
 });

此代码段是此示例的摘录。

对于我建议您使用的工具栏方式，只需在GridPanel的工具栏中添加一个按钮并挂钩SelectionModel，这样您就可以在用户未选择任何行时禁用这些按钮。