Ext JS3.4表格grid每一行添加按钮

摘自：https://www.cnblogs.com/280850911/archive/2012/08/10/2632151.html

var data = [
                       { 'id': 1, 'name': '小王', 'sex': '男' },
                       { 'id': 2, 'name': '小李', 'sex': '男' },
                       { 'id': 3, 'name': '小兰', 'sex': '女' }
             ];

            var store = new Ext.data.JsonStore({
                data: data,
                fields: ['id', 'name', 'sex']
            });

            //创建模板 
            var tplCum = new Ext.XTemplate(
                 '<div><table style="border-bottom-style: groove; border-bottom-width: thin">',
                 '<tr>                                                              ',
                 '<td style="width:35px"></td>                                      ',
                 '    <td style="width:300px">                                      ',
                 '        <table><tr>                                               ',
                 '        <td style="width:100px">姓名：{name}</td>                 ',
                 '        <td style="width:100px">性别：{sex}</td>                  ',
                 '        <td >邮箱：</td>                                          ',
                 '        </tr></table>                                             ',
                 '        </td>                                                     ',
                 '    <td style="width:20px"></td>                                 ',
                 '</tr>                                                             ',
                 '<tr style="height:30px;color:blue;vertical-align: middle;">      ',
                 '    <td >意见：</td>                                              ',
                 '    <td ></td>                                                    ',
                 '    <td >提出时间：{Time}</td>                                    ',
                 '</tr>                                                             ', //每行以逗号隔开
                 '</table></div>                                                    '  //最后一行不用逗号
             );
 
             var AdviceGrid = new Ext.grid.GridPanel({
                      store: store,
                      height:300,
                      region: 'center',
                      autoScroll: true,
                      containerScroll: true,
                      stripeRows: true,
                      frame: true,
                      loadMask: {
                          msg: '数据加载中，请稍等......'
                      },
                      cm: new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(),
                             { header: "编号", dataIndex: "Id", tooltip: "编号", sortable: true, hidden: true, width: 50 },
                        //模板
                        { text: '描述', xtype: 'templatecolumn', tpl: tplCum, width: 400 },
                        //按钮
                        { header: "", dataIndex: "c_reply", width: 50,
                          renderer: function (value, cellmeta) { return "<INPUT type='button' value='回复'>";}
                        },
                        { header: "", dataIndex: "c_agree", width: 50,
                          renderer: function (value, cellmeta) { return "<INPUT type='button' value='采纳'>"; }
                         }
           
                         ]),
                      tbar: [{
                          pressed: true,
                          enableToggle: true,
                          text: 'add',
                          id: '_btnShowRead',
                          iconCls: 'add',
                          handler: function () {
           
                          }
                      }, '-', {
                          pressed: true,
                          enableToggle: true,
                          text: 'edit',
                          id: '_btnShowAll',
                          iconCls: 'edit',
                          handler: function () {
           
                          }
                      }],
                      bbar: new Ext.PagingToolbar({
                          pageSize: 20,
                          store: store,
                          displayInfo: true
                      })
              });

                  //添加cell单击事件
             AdviceGrid.addListener('cellclick', cellclick);
             function cellclick(AdviceGrid, rowIndex, columnIndex, e) {
                 if (rowIndex < 0) {
                     return;
                 }
                 var record = AdviceGrid.getStore().getAt(rowIndex); //Get the Record 
                 var id = record.get('id');
                 var fieldName = AdviceGrid.getColumnModel().getDataIndex(columnIndex); //Get field name 
                 if (fieldName == "c_reply") {
                     Ext.Msg.alert('c_reply', rowIndex + "  -  " + id);
                 } else if (fieldName == "c_agree") {
                     Ext.Msg.alert('c_agree', rowIndex + "  -  " + id);
                 }
             }