Как я могу прикрепить обработчик события onfocus к строке в сетке extJS? - PullRequest
Новая
       16

Как я могу прикрепить обработчик события onfocus к строке в сетке extJS?

4 голосов
/ 17 ноября 2010

У меня есть следующая сетка на странице extJS.

Каков синтаксис для присоединения обработчика событий onfocus или onclick к строке, чтобы, когда пользователь щелкает строку, я мог вызвать функцию, отправив ей индекс строки или сам объект строки?

alt text

var myData = [['Computer1', 29.89, 0.24, 0.81, '2010-11-17 08:31:12'], ['Computer2', 83.81, 0.28, 0.34, '2010-11-14 08:31:12'], ['Network1', 71.72, 0.02, 0.03, '2010-11-12 08:31:12'], ['Network2', 52.55, 0.01, 0.02, '2010-11-11 08:31:12'], ['Other', 29.01, 0.42, 1.47, '2010-11-04 08:31:12']];

var myReader = new Ext.data.ArrayReader({}, [{
    name: 'object'
}, {
    name: 'Number of Connections',
    type: 'float'
}, {
    name: 'status',
    type: 'float'
}, {
    name: 'rank',
    type: 'float'
}, {
    name: 'lastChange',
    type: 'date',
    dateFormat: 'Y-m-d H:i:s'
}]);

var grid = new Ext.grid.GridPanel({
    style: 'margin-top: 10px',
    store: new Ext.data.Store({
        data: myData,
        reader: myReader
    }),
    columns: [{
        header: 'Object',
        width: 120,
        sortable: true,
        dataIndex: 'object'
    }, {
        header: 'Status',
        width: 90,
        sortable: true,
        dataIndex: 'status'
    }, {
        header: 'Rank',
        width: 90,
        sortable: true,
        dataIndex: 'rank'
    }, {
        header: 'Last Updated',
        width: 120,
        sortable: true,
        renderer: Ext.util.Format.dateRenderer('Y-m-d H:i:s'),
        dataIndex: 'lastChange'
    }],
    viewConfig: {
        forceFit: true
    },
    renderTo: 'content',
    title: 'Computer Information',
    width: 500,
    autoHeight: true,
    frame: true
});

grid.getSelectionModel().selectFirstRow();

Ответы [ 2 ]

5 голосов
/ 18 ноября 2010

На самом деле вам обычно лучше обрабатывать события модели выбора, так что ваш код обработки будет последовательно реагировать на события мыши и клавиатуры. Например., 

grid.getSelectionModel().on('rowselect', function(sm, idx, rec){
    alert(idx); //row index
});
3 голосов
/ 17 ноября 2010

На панели сетки добавьте прослушиватель для события rowclick. 

listeners: {
  'rowclick': function(grid, index) {
    // do whatever
  }
}
...