View Full Version : [FIXED] Tree panel: clicking on expander icon also selects the node

12 Apr 2014, 12:17 PM
In ExtJS, when you click on expander icon of a tree node, it expands and also selects the tree node. In previous versions, you were able to expand without the side effect of selecting the node. This behavior is not desired and the fix is easy: using itemclick event instead of rowclick in RowModel for selecting. This is because in Ext.tree.View class, onBeforeItemMouseDown event is already canceled for expander icon but this does not prevent RowModel from doing the selection as it's listening to rowclick event and not itemclick event. I am not sure how row* and item* events are mapped but maybe with the new event system the names should match.

Note: I have not tested yet but this may also fix "not being able to select tree nodes" problem I observed in IE 8.

Ext.override(Ext.selection.RowModel, {
bindComponent: function(view) {
var me = this;
// Because we used to select on mousedown, contextmenu (right click) used to also select.
// Now we use click, for backward compatibility, we need to select on contextmenu too.
// Apps may assume that contextmenu selects: https://sencha.jira.com/browse/EXTJSIV-11297
rowcontextmenu: me.onRowClick,
itemclick: me.onRowClick, //==> Fix: using itemclick instead of rowclick
scope: me
if (me.enableKeyNav) {


name : 'Fiddle',
launch : function() {
var store = Ext.create('Ext.data.TreeStore', {
root: {
expanded: true,
children: [
{ text: "detention", leaf: true },
{ text: "homework", expanded: true, children: [
{ text: "book report", leaf: true },
{ text: "algebra", leaf: true}
] },
{ text: "buy lottery tickets", leaf: true }
Ext.create('Ext.tree.Panel', {
title: 'Simple Tree',
width: 400,
height: 300,
store: store,
rootVisible: false,
renderTo: Ext.getBody()


18 Apr 2014, 5:38 AM
Thanks for the report! I have opened a bug in our bug tracker.