CODEWITHSUNDEEP
extjs
prajeesh
prajeesh

Reputation: 2382

Extjs Tree editor - disable single click to edit

I am using tree editor. I need the tree node to become editable only when it is double clicked. So far I have done this 

  var tree = new Ext.tree.TreePanel({
      root: this.getChildren(),
      height: 300,
      loader: new Ext.tree.TreeLoader(),
      useArrows: true,
      autoScroll: true,
      listeners: {
          dblclick: onTreeNodeDblClick
      }
  });

  var treeEditor = new Ext.tree.TreeEditor(tree, {}, {
      cancelOnEsc: true,
      completeOnEnter: true,
      selectOnFocus: true,
      allowBlank: false,
      listeners: {
          complete: onTreeEditComplete
      }
  });

  onTreeNodeDblClick: function (n) {
      treeEditor.editNode = n;
      treeEditor.startEdit(n.ui.textNode);
  }

  onTreeEditComplete: function (treeEditor, o, n) {}

I have searched the api to find something like "clicksToEdit" which we use in editor grid but cant find anything. Is there any way to do this?

Upvotes: 0

Views: 2420

Answers (2)

Alex
Alex

Reputation: 21

Ext.tree.TreeEditor adds two event listeners (beforeclick, dblclick) to tree so you may unsubscribe its from tree

tree.on('afterrender', function() {
    tree.un('beforeclick', treeEditor.beforeNodeClick, treeEditor);
    tree.un('dblclick', treeEditor.onNodeDblClick, treeEditor);
})

Upvotes: 2

lucian
lucian

Reputation: 73

From API of Ext.tree.TreePanel:

beforeclick : ( Node node, Ext.EventObject e )

Fires before click processing on a node. Return false to cancel the default action.

So you could do this:

var tree = new Ext.tree.TreePanel({
  root: this.getChildren(),
  height: 300,
  loader: new Ext.tree.TreeLoader(),
  useArrows: true,
  autoScroll: true,
  listeners: {
      dblclick: onTreeNodeDblClick,
      beforeclick: function() { return false;}
  }

});

Upvotes: 0

Related Questions