title: How to add a listener to some buttons extjs
body: <p>I'm a newbie of extjs (using ext.js 4.1),I'm still learning it, but the thing that I have to do now is a little tricky and I would like to have the advice of a more experienced developer. The problem is regarding these buttons:</p>
  
  <pre><code>{
      xtype : 'checkboxgroup',
  store : checked,
  columns : 3,
  vertical : false,
  singleSelect: true,
  items : [
  {
      xtype: 'button',
      text: 'name',
      width: 75,
      toggleGroup: 'mygroup',
      enableToggle: true
  }, {
      xtype: 'button',
      text: 'email',
      width:75,
      toggleGroup: 'mygroup',
      enableToggle: true
  }, {
      xtype: 'button',
      text: 'id',
      width: 75,
      toggleGroup: 'mygroup',
      enableToggle: true
  }
  ],
  listeners : 
  {
      'change' :
  // store checked field
  function(th, newValue, oldValue) {
      var ics = th.items.items;
      for (i = 0; i &lt; 3; i++) {
          checked[i] = ics[i].checked;
          }
  }
  }
  }
  </code></pre>
  
  <p>As you can see there is a listener, it was working when the buttons were only checkboxes (i'm changing them now to be checked only one at time). Now I assume I have to change the listener to many more listeners, one for each button. But the questions are:</p>
  
  <ul>
  <li><p>How do i get the value from the buttons? </p></li>
  <li><p>How should the function of the listener be structured at the level of the parameters of the function?</p></li>
  <li><p>I will have to change the "checked" variable which filters the store... </p></li>
  </ul>
  
  <p>I'm copying from <a href="https://stackoverflow.com/questions/12677522/extjs-4-1-check-change-listener?rq=1">this</a> answer, but it doesn't work still. It doesn't register the event.</p>