1. #1
    Sencha Premium Member
    Join Date
    May 2012
    Posts
    63
    Vote Rating
    1
    Answers
    1
    stevanicus is on a distinguished road

      0  

    Default Unanswered: Single click to open tree node

    Unanswered: Single click to open tree node


    Hi,

    I'm trying to configure my tree panel to open collapsed nodes per single click... I have tried implementing my own method on the "itemclick" event... but this seem to open up other problems when animations are not completed in time.... i.e. its "children" are not hidden and left visible, doubling with the next node expand() - this happens if you try to expand and collapse a node in quick succession.

    I also tried passing singleClickExpand: true attribute in json passed from the server... but no luck.

    Is there anything preset by Extjs for this feature? I can't seem to find anything in the documentation.

    Thanks in advance

  2. #2
    Sencha Premium Member Zdeno's Avatar
    Join Date
    Nov 2009
    Location
    Prague
    Posts
    447
    Vote Rating
    21
    Answers
    8
    Zdeno will become famous soon enough Zdeno will become famous soon enough

      0  

    Default


    I think you need override your tree or add plugin because click function expand the node only when you click on expander selector:

    Code:
    onItemClick: function(record, item, index, e) {
    	if (e.getTarget(this.expanderSelector, item) && record.isExpandable()) {
    	    this.toggle(record, e.ctrlKey);
    	    return false;
    	}
    	return this.callParent(arguments);
    }
    Check dblclick function below:

    Code:
    onItemDblClick: function(record, item, index) {
    	var me = this,
    	editingPlugin = me.editingPlugin;
    
    
    	me.callParent(arguments);
    	if (me.toggleOnDblClick && record.isExpandable() && !(editingPlugin && editingPlugin.clicksToEdit === 2)) {
    		me.toggle(record);
    	}
    }
    I think its pretty simple to make node expandable by single click.

  3. #3
    Touch Premium Member suzuki1100nz's Avatar
    Join Date
    Apr 2011
    Location
    New Zealand
    Posts
    450
    Vote Rating
    66
    Answers
    21
    suzuki1100nz is just really nice suzuki1100nz is just really nice suzuki1100nz is just really nice suzuki1100nz is just really nice

      0  

    Default


    Try this.
    Define an extension to Ext.tree.Panel

    Add the following constructor and method

    Code:
    constructor: function() {
      var me = this;
      me.callParent(arguments);
      
      //Arm an item click listener so we can force and expand or collapse
      me.on('itemclick', me.itemClicked, me, {});
    },
    
     itemClicked : function(obj, record, item, index, e, eopts) {
        var me = this,
        isExpanded = record.isExpanded();
        //If the node is expandable and it is currently expanded the collapse otherwise expand
        (record.isExpandable() && isExpanded) ? me.collapseNode(record) : me.expandNode(record);
      }

Thread Participants: 2

Tags for this Thread