Question

I am creating a grid panel and want to attach an event with each row. following is my code

var locationdata  = Ext.create('Ext.data.Store', {
    fields:['name'],
    storeId:'simpsonsStore',
    data:{'items':[
                { 'name': 'Lisa'}
            ]},
         proxy: {
             type: 'memory',
             reader: {
                 type: 'json',
                 root: 'items'
             }
         }

});

hintBox = Ext.create('Ext.grid.Panel', {
    title: 'Location List',
    store: locationdata,
    columns: [
        { header: 'Name',  dataIndex: 'name' , flex:1 }
    ],
    flex: 5
});
hintBox.getSelectionModel().on('rowselect', function(sm, rowIdx, r) {
     alert("row selected");
});

I am adding hintBox in anothor panel which is rendered to body.

What is wrong with this code?

Answer 1

Selection model has no event ‘rowselect’, In Extjs 4 selectiom model has only selectionchange event.

hintBox.getSelectionModel().on('selectionchange', function(sm, selectedRows, opts) {
      //selected rows is an array of models and if you want just one row selected,
      //you have to config the grid so it only accepts one selection i think is selType: 'SINGLE' or 'SIMPLE'
      // and after that selectedRows[0] will be the selected row
      alert("rows selected");
});