How do I get column name from rowselection in an ExtJS grid?
extjs, grid, javascript
Solution
The "cellclick" event on the grid is the way to go. A function listening on this event gets passed:
- `( Grid this, Number rowIndex, Number columnIndex, Ext.EventObject e )`
If you want to get the text of the gridCell, calling `yourGrid.getView().getCell(rowIndex, colIndex)` will return the DOM element.
If you want to get the column header, call: `yourGrid.getColumnModel()`.`getColumnHeader(colIndex)`
If you want to find anything else out about a particular column, call `yourGrid.getColumnModel()`.`getColumnAt(colIndex)`
Problem
I have a extjs gridpanel setup, and I want to be able to do things based on a user clicking on text or icons in the grid. For example, filter the grid if the user clicks (or double clicks) a word in a column, or show a popup if the user clicks on an icon. I can easily get the row they clicked on, and values by column name from that row, but I don't know which column was clicked. Alternatively, I could add an onClick to the entire grid, which I could then get the individual text from the row/column, but I don't know what row index or column that value belongs to. I could add a CSS class that would tell me a column name, but that seems like a hack. Is there anything built-in that can do this?