View Full Version : RowExpander - Click on its content doesn't select the row

25 Apr 2010, 6:44 PM

I'm using the RowExpander and I created a template with a few DIVs to use as extra content for the rows. The problem is that when I click on its content, the row isn't selected. The user has to click on the "background" of the template (where there is no div), or on the row itself (not the content of the RowExpander), that is not convenient.

The way I handle this right now is by overriding the "beforeExpand" of the RowExpander, and to add a listener (onclick) directly on the HTML element. Then, I manually select the ad-hoc row in the grid. Here is the code:

Ext.override(Ext.ux.grid.RowExpander, {
beforeExpand : function(record, body, rowIndex){
if(this.fireEvent('beforeexpand', this, record, body, rowIndex) !== false){
if(this.tpl && this.lazyRender){
body.innerHTML = this.getBodyContent(record, rowIndex);
var me = this;
// Added:
body.onclick = function () {
return true;
return false;

It works fine, but it seems I create a new listener for each 'expand' :-?. I would really prefer to get the click event on the content and to re-fire it directly on the row.onclick ... but I failed in trying ;) I would like to know the best way to handle this issue in a neat way.

Thank you!