Extjs добавляет событие к кнопке в сетке из контроллера - PullRequest
Новая
       4

Extjs добавляет событие к кнопке в сетке из контроллера

0 голосов
/ 17 января 2012

Я добавил панель инструментов в свою сетку Я не могу связать событие в контроллере / контроле Скучно надо править, когда код сам себя объяснит:) 

Ext.define('SA.view.user.List' ,{
  extend: 'Ext.grid.Panel',
  alias : 'widget.userlist',
  title : 'All Users',
  store: 'Users',
  initComponent: function() {

    this.columns = [
      {
      header: 'Id',
      sortable: true,
      dataIndex: 'id',
      flex: 1,
      field: {
        type: 'textfield'
      }
    },
    {
      header: 'Name',
      sortable: true,
      dataIndex: 'uname',
      flex: 1,
      field: {
        type: 'textfield'
      }
    },
    {
      header: 'Email',
      sortable: true,
      dataIndex: 'email',
      flex: 1,
      field: {
        type: 'textfield'
      }
    }
    ];

    this.callParent(arguments);
  },

  dockedItems: [
    {
    xtype: 'toolbar',
    items: [{
      iconCls: 'icon-add',
      text: 'Add',
      scope: this

    }, {
      iconCls: 'icon-delete',
      text: 'Delete',
      disabled: true,
      itemId: 'delete',
      scope: this

    }]
  },
  {
    xtype: 'pagingtoolbar',
    store: 'Users',   // same store GridPanel is using
    dock: 'bottom',
    displayInfo: true
  }
  ]
});

Как обработать форму события щелчка в контроллере 

init: function() {
    this.control({
        'userlist': {
            itemdblclick: this.editUser
        },
        'userlist > toolbar/*my attempt but it doesnt work :( */': {
            click: this.insertUser
        },
        'useredit button[action=save]': {
            click: this.updateUser
        }
    });
},

Пока

Ответы [ 3 ]

3 голосов
/ 17 января 2012

может быть, вы можете изменить это так 

dockedItems: [
    {
    xtype: 'toolbar',
    items: [{
      iconCls: 'icon-add',
      text: 'Add',
      action: 'add',
      scope: this

    }, {
      iconCls: 'icon-delete',
      text: 'Delete',
      action: 'delete',
      disabled: true,
      itemId: 'delete',
      scope: this

    }]
  },


init: function() {
    this.control({
        'userlist': {
            itemdblclick: this.editUser
        },
        'userlist button[action=add]': {
            click: this.insertUser
        },
        'useredit button[action=save]': {
            click: this.updateUser
        }
    });
},
1 голос
/ 19 января 2012

Попробуйте userlist button[text=Delete]': { click: this.insertUser } или userlist button[itemId=delete]': { click: this.insertUser }.

Этот селектор похож на селекторы из CSS, поэтому обычно вы используете container > child_subcontainer another_subcontainer element[property=value]. Под контроллером используется Ext.ComponentQuery , поэтому вы можете поиграть с ним, чтобы проверить, что он может.

0 голосов
/ 27 августа 2013

Простое добавление части действия также будет работать. 

init: function() {
    this.control({
        'userlist': {
            itemdblclick: this.editUser
        },
        'userlist > toolbar > button[action=add]': {
            click: this.insertUser
        },
        'useredit button[action=save]': {
            click: this.updateUser
        }
    });
},
...