I have the following code in a grid:

    var grid = Ext.create('Ext.grid.Panel', {
        store: store,
        stateful: true,
        stateId: 'stateGrid',
        columns: [
            {
                text     : 'Job ID',
                width : 75,
                sortable : true,
                dataIndex: 'id'
            },
            {
                text     : 'File Name',
                width    : 75,
                sortable : true,
                dataIndex: 'filename', 
                listeners : {
                    'mouseover' : function(iView, iCellEl, 
                                  iColIdx, iRecord, iRowEl, iRowIdx, iEvent) {
                       var zRec = iView.getRecord(iRowEl);
                       alert(zRec.data.id);
                    }
                }

...etc...

I can't figure out how to get the cell value of the first column in the row. I've also tried:

        var record = grid.getStore().getAt(iRowIdx); // Get the Record
        alert(iView.getRecord().get('id'));

Any ideas?

Thanks in advance!

I have the following code in a grid:

    var grid = Ext.create('Ext.grid.Panel', {
        store: store,
        stateful: true,
        stateId: 'stateGrid',
        columns: [
            {
                text     : 'Job ID',
                width : 75,
                sortable : true,
                dataIndex: 'id'
            },
            {
                text     : 'File Name',
                width    : 75,
                sortable : true,
                dataIndex: 'filename', 
                listeners : {
                    'mouseover' : function(iView, iCellEl, 
                                  iColIdx, iRecord, iRowEl, iRowIdx, iEvent) {
                       var zRec = iView.getRecord(iRowEl);
                       alert(zRec.data.id);
                    }
                }

...etc...

I can't figure out how to get the cell value of the first column in the row. I've also tried:

        var record = grid.getStore().getAt(iRowIdx); // Get the Record
        alert(iView.getRecord().get('id'));

Any ideas?

Thanks in advance!

• javascript
• extjs
• extjs4
• javascript-framework

• 1 I think you are so very close. Try alert(record.get('id')); instead of iView.getRecord... – Hemlock Commented Nov 17, 2011 at 23:00

2 Answers 2

It's easier than what you have.

Look at the Company column config here for an example- http://jsfiddle/qr2BJ/4580/

Edit:

Part of grid definition code:

....
columns: [
    {
        text     : 'Company',
        flex     : 1,
        sortable : false,
        dataIndex: 'pany',
        renderer : function (value, metaData, record, row, col, store, gridView) {
            metaData.tdAttr = 'data-qtip="' + record.get('price') + ' is the price of ' + value + '"';
            return value;
        }
    },
    ....

You can add a handler instead of a listener.

{
    header: 'DETAILS',
    xtype:'actioncolumn', 
    align:'center', 
    width: 70, 
    sortable: false, 
    items: [
        {
            icon: '/icons/details_icon.png',  // Use a URL in the icon config
            tooltip: 'Show Details',    
            handler: function(grid, rowIndex, colIndex) {
                var record = grid.getStore().getAt(rowIndex);
            }