maecy m
maecy m

Reputation: 1397

Extjs 4.2: Getting the selected cell value in grid panel

I want to get the value of the selected cell in my grid. I have the following codes:

methods:

createPlaylist: function(record){
var scope = this;
var srecords = getShowImages.getSelectionModel().getSelection();

console.log(srecords); }

I use the console.log to check if I am getting any value.

grid view:

 Ext.ns('dlti.view.widget');
   Ext.define('dlti.view.widget.ShowImages' ,{
    extend: 'Ext.grid.Panel',
    id: 'dlti-grid-images',
    alias: 'widget.ShowImages',
    forceFit: true,
    stripeRows: true,
    selType: 'checkboxmodel',
    multiSelect: true,
    autosync: true,
    height: 250,
    width: 470,


    store: new dlti.store.UploadStore(),


    columns: [
        {
            text: 'Images',
            dataIndex: 'imagepath',
            renderer:   function renderIcon(val) {
                return '<img src="' + val + '"width="100px" height="100px" align="middle">';

            },          

        },
        {
            text: 'Filename',
            dataIndex: 'filename',
            renderer:   function renderDescTarget(val, p, record) {
                var desc = '';
                desc = '<p style="color:#000;font-size:12px;">' + val + '</p>';
                return desc;
            }
        }



    ]
});

Upvotes: 1

Views: 11308

Answers (3)

Dayynissh
Dayynissh

Reputation: 53

You need to add a Select listener such as;

selModel: Ext.create('Ext.selection.CellModel', {
                        allowDeselect: true,
                        mode: 'SINGLE',
                        listeners: {
                            select: {
                                fn: me.onCellModelSelect,
                                scope: me
                            }
                        }
                    })

Following that, the function to alert the value of the cell should be something like follows;

onCellModelSelect: function(cellmodel, record, row, column, eOpts) {

        /*an if statement is required to parse the column chosen as
        record.get() only accepts string values of the column name so
        if the columns are named "first", "second", "third", the
        following if statement applies*/

        var columnName;

        if(column === 0){
            columnName= 'first';
        }else if(column === 1){
            columnName= 'Second';
        }else if(column === 2){
            columnName= 'Third';
        }
        Ext.Msg.alert('Cell Value',record.get(columnName));
    }
});

Hope it works for you. If you want me to send you the whole page of code for this, PM me! <3

Upvotes: 1

CD..
CD..

Reputation: 74096

The grid has a cellclick event you can use:

Fired when table cell is clicked.

EDIT:

In your grid you can add a listener that will be fired each time a cell is clicked (you can add it to the controller instead), like:

listeners : {
    cellclick : function(view, cell, cellIndex, record, row, rowIndex, e) {
        console.log(cell);
    }
}

Upvotes: 0

wonu wns
wonu wns

Reputation: 3608

You have to listen to gridpanel's cellclick event. In your view, you have to add the following on your gridpanel's config:

listeners : {
    cellclick : function(view, cell, cellIndex, record, row, rowIndex, e) {
        //handle event   
    }
}

Upvotes: 0

Related Questions