1. #1
    Ext JS Premium Member
    Join Date
    Feb 2008
    Posts
    51
    Vote Rating
    0
    noamway is on a distinguished road

      0  

    Question Unanswered: Add small buttons inside tree

    Unanswered: Add small buttons inside tree


    Hi,

    I have a tree with a list of pages and I like to add a button to the right of every page in the tree.
    This icon will use me to open a the user a drop menu that I already open with the right click method.

    Today most of my user don't know they can "right click" every page in the menu so I really like to give them the option to see this button.

    I attache an example where I need the button and I really like to know what is the best way to do that.

    Thanks,
    Noam
    Attached Images

  2. #2
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,508
    Answers
    13
    Vote Rating
    56
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Use an ActionColumn

  3. #3
    Ext JS Premium Member
    Join Date
    Feb 2008
    Posts
    51
    Vote Rating
    0
    noamway is on a distinguished road

      0  

    Default


    Thanks, This my first time I'm using it, what I'm doing wrong:
    Code:
    var sideMenuSection = new Ext.tree.Panel({
    	id:'east-panel',
    	region:rightSide,
    	collapsible: true,
    	collapsed: true,
    	collapseMode: 'mini',
    	animCollapse: false,
    	animFloat: false,
    	header : false,
    	border: false,
    	split: true,
    	width: 240,
    	minSize: 20,
    	maxSize: 700,
    	margins:'0 0 0 0',
    	layout: 'border',
    	ctCls: 'GoToThe'+interfaceAlign+'',
    	autoScroll:true,
    	columns: [{
    			id: 'treePagesList',
    			xtype: 'treecolumn',
    			viewConfig: {
    				plugins: {
    					ptype: 'treeviewdragdrop'
    				}
    			},
    			animate:true,
    			ddConfig:true,
    			containerScroll: true,
    			rootVisible: false,
    			ctCls: 'GoToThe'+interfaceAlign+'',
    			store: Ext.create('Ext.data.TreeStore', {
    				proxy: {
    					type: 'ajax',
    					url: hasTopPagesMenuBOO ? '/site/include/newfeel/website3/function/FastManagePagesV9.asp?menuUpNavBOO=1' : hasSidePagesMenuBOO ? '/site/include/newfeel/website3/function/FastManagePagesV9.asp?menuSideNavBOO=1' : '/site/include/newfeel/website3/function/FastManagePagesV9.asp?menuNotShowBOO=1'
    				},
    				root: {
    					id:'root',
    					text: 'Pages',
    					expanded:false
    				}
    			})
    		},{
    			xtype: 'actioncolumn',
    			items: [{
    				icon: 'app/resources/images/cog_edit.png',
    				// Use a URL in the icon config
    				tooltip: 'Edit',
    				handler: function (grid, rowIndex, colIndex) {
    					var rec = grid.getStore().getAt(rowIndex);
    					alert("Edit " + rec.get('firstname'));
    				}
    			}, {
    				icon: 'app/resources/images/delete.png',
    				tooltip: 'Delete',
    				handler: function (grid, rowIndex, colIndex) {
    					var rec = grid.getStore().getAt(rowIndex);
    					alert("Terminate " + rec.get('firstname'));
    				}
    			}]
    	}]
    });

Thread Participants: 1

Tags for this Thread