View Full Version : headermousedown bug?

14 Jan 2011, 10:11 AM
In v3.3.1, I was trying to click unadorned column headers to highlight the cells in their respective columns.

It appears the header menu is supposed to be present in order to see the headermousedown event. However, if the header menu is disabled, you can still click very near the left or right edge of the header (in the padding?) and trigger the event. I suspect this isn't the desired behavior.

<style type="text/css">
.CellClicked {background-color:#BFFFBF}

<script type="text/javascript">
gp_Demo = new Ext.grid.GridPanel(
{ border: false,
colModel: new Ext.grid.ColModel(
{ columns: [ { dataIndex: 'A',
header: 'AAA',
renderer: DemoGridRenderer, // function un/shades cell; no data shown
width: 40
... // 7 more similar columns 50px wide
defaults: { fixed: true,
menuDisabled: true // Prefer plain
} ),
columnLines: true,
disableSelection: true, // Doing my own
listeners: { cellmousedown: DemoGridCellClick, // function toggles cell data
headermousedown: DemoGridHeaderClick // function toggles cell data in col
renderTo: document.getElementById( 'DemoGridDiv' ),
store: as_DemoGrid, // ArrayStore
viewConfig: { markDirty: false, // Prefer plain
scrollOffset: 0 // Didn't eliminate click zone
width: 391
} );

function DemoGridHeaderClick( gp_Demo, i__ColumnClicked, eo_Clicked )

{ var ds_DemoGrid;
var s__FieldName;
var rc_Loop;
var i__Records;

ds_DemoGrid = gp_Demo.getStore();
s__FieldName = ds_DemoGrid.getColumnModel().getDataIndex( i__ColumnClicked );
i__Records = ds_DemoGrid.getCount();
for( var i__Record = 0; i__Record < i__Records; i__Record++ )
{ rc_Loop = ds_DemoGrid.getAt( i__Record );
rc_Loop.set( s__FieldName, 'X' );

function DemoGridRenderer( value, metaData, record, i__Row, i__Column, ds_DemoGrid )
{ if( value == 'X' )
metaData.css = 'CellClicked';
return '';
Note: this code was re-typed and may contain typos.

If I'm mis-using headermousedown, please LMK; I'm still looking for a way to have clickable, unadorned column headers.

17 Jan 2011, 12:19 AM
The fact that you don't get a headermousedown event has nothing to do with the menuDisabled config option.

It is caused by enabling drag & drop for column moving. You should configure your GridPanel with:

enableColumnMove: false

24 Feb 2011, 5:07 PM
Thank you, Condor. I had discovered enableColumnMove but didn't include it in the post because I was trying to point out a different problem (a bug?):
With menuDisabled = true and enableColumnMove = true, clicking extremely close to the left or right edge of the header still fires headermousedown.

It appears that setting enableColumnMove = false creates an element that is supposed to cover the header and prevent headermousedown from firing. I don't think that element is covering the header completely - not in IE8, at least.

Coming from the Java world, I expected headermousedown to fire whenever the header was clicked. I was mystified that setting enableColumnMove = false made it work as expected, and just moved on to the next challenge.