ExtJS - 单击按钮获取网格的选定值

时间:2015-07-04 08:59:38

标签: javascript extjs extjs5 sencha-architect

我是Ext JS的新手,所以我发现获得这个简单逻辑有点困难。

我在标签面板中有一个网格。我添加了两个按钮'添加'并且'更新'在这个网格和。点击'添加',我想看到所选行的值。

代码如下:

Ext.define('XYZ.view.PlantInformation', {
      extend: 'Ext.panel.Panel',
      alias: 'widget.plantinformation',

      requires: [
        'XYZ.view.PlantInformationOldViewModel1',
        'Ext.tab.Panel',
        'Ext.tab.Tab',
        'Ext.grid.Panel',
        'Ext.grid.column.Column',
        'Ext.view.Table',
        'Ext.toolbar.Spacer'
      ],

      viewModel: {
        type: 'plantinformation'
      },
      height: 500,
      width: 800,
      layout: 'fit',
      title: 'Plant Information',
      defaultListenerScope: true,

      items: [{
        xtype: 'tabpanel',
        activeTab: 0,
        items: [{
            xtype: 'panel',
            scrollable: 'true',
            title: 'Plant',
            items: [{
              xtype: 'gridpanel',
              itemId: 'PlantTab',
              scrollable: true,
              bodyBorder: true,
              bind: {
                store: 'PlantStore'
              },
              columns: [{
                xtype: 'gridcolumn',
                dataIndex: 'ID_PLANT',
                text: 'Plant ID'
              }, {
                xtype: 'gridcolumn',
                dataIndex: 'DS_PLANT',
                text: 'Plant Name',
                flex: 1
              }],
              dockedItems: [{
                xtype: 'panel',
                dock: 'bottom',
                width: 100,
                layout: {
                  type: 'hbox',
                  align: 'stretch',
                  pack: 'end'
                },
                items: [{
                  xtype: 'button',
                  flex: 1,
                  text: 'Add',
                  listeners: {
                    click: 'onButtonClick'
                  }
                }, {
                  xtype: 'tbspacer',
                  flex: 1
                }, {
                  xtype: 'button',
                  flex: 1,
                  text: 'Update'
                }]
              }],
              listeners: {
                select: 'onGridpanelSelect'
              }
            }]
          },

        ],

        onButtonClick: function(button, e, eOpts) {
          var grid = Ext.getCmp('PlantTab');
          var selection = grid.getSelectionModel().getSelection()[0];
          alert(selection);
        },

        onGridpanelSelect: function(rowmodel, record, index, eOpts) {


        }

      });

我收到错误:

  

未捕获的TypeError :无法读取属性' getSelectionModel'未定义的

gt这个简单的事情我做错了什么?

提前提醒!

1 个答案:

答案 0 :(得分:1)

如果要使用itemId: 'PlantTab'检索组件,请替换:

id: 'PlantTab'

使用:

id

在您的网格配置中。

itemId是全局的,{{1}}的范围是父容器。