Search Results

Search found 17 results on 1 pages for 'treepanel'.

Page 1/1 | 1 

  • ExtJS - Save State of treePanel.

    - by Ozaki
    TLDR I want my treepanel from EXTJS to remember its previous settings. ExtJS-3.2.1 I have seen this done before for ExtJS-2.x.x :See here on the extjs forums. But as seen as they are pretty much lifeless, with threads on there asking this question or similar with no reply for up to 6months. I thought I would bring it here. I need to be able to get my treePanel to remember previous opened folders and which boxes are checked. It is async treePanel. Panel is as follows: var layerTree = new Ext.tree.TreePanel({ border: true, region: "east", title: 'LayersTree', width: 250, split: true, collapsible: true, collapsed: true, iconCls: 'treePanelIcon', enableDD: true, autoScroll: true, //pulls in layers and their attributes// root: new Ext.tree.AsyncTreeNode({ leaf: false, loaded: false, expanded: true, text: 'Tree Root', children: treeLayers }) Am using ExtJS-3.2.1, GeoExt, OpenLayers. Anyone done this before or know how to do it? (Preferably with a plugin but any answer is appreciated)

    Read the article

  • How to reload Ext.tree.TreePanel on demand?

    - by Sergei Stolyarov
    I want to create Ext.tree.TreePanel component and periodically load content from the external URl. So I've written something like new Ext.tree.TreePanel({ root: { nodeType: 'async', text: 'asdasd', draggable: false, id: 'folders-tree-root' }, loader: new Ext.tree.TreeLoader() }); And now I want to reload this tree, so I write: tree.loader.dataUrl = 'folders-sample.json'; tree.root.reload(); And nothing happens. add: The only way I've found is set some invalid value to dataUrl param on TreeLoader creation: new Ext.tree.TreePanel({ root: { nodeType: 'async', text: 'asdasd', draggable: false, id: 'folders-tree-root' }, loader: new Ext.tree.TreeLoader(dataUrl: 'something') });

    Read the article

  • [Ext.tree.TreePanel] getNodeById does not work

    - by Moon
    Hi, I have a ext treepanel with json. var tree = new Ext.tree.TreePanel({ renderTo:'tree-container', title: 'Category', height: 300, width: 400, useArrows:true, autoScroll:true, animate:true, enableDD:true, containerScroll: true, rootVisible: false, frame: true, root: { text: 'Category', draggable: false, id: '0' }, // auto create TreeLoader dataUrl: $("#web").val() + "/category/index/get-nodes", listeners: { 'checkchange': function(node, checked){ if(checked){ categoryManager.add(node.id); //node.getUI().addClass('complete'); }else{ categoryManager.remove(node.id); // node.getUI().removeClass('complete'); } } } }); dataUrl loads the following json code [{"text":"Code Snippet","id":"1","cls":"folder","checked":false,"children":[{"text":"PHP","id":"3","cls":"file","checked":false,"children":[]},{"text":"Javascript","id":"4","cls":"file","checked":false,"children":[]}]}] when I try to find a node by console.log( tree.getNodeByid(3) ), it shows that it is undefined. Do I have a problem with my code?

    Read the article

  • How to select TreePanel node(Parent/child) in selenium java

    - by sai kumar
    My Application having TreePanel Element and I have to select the root node at the begining to add child node underit. When I try to click on root node using its XPATH String locator = "//div[@id='resultPropertyTree']/div/table/tbody/tr/td"; selenium.clickAt(locator,"0,1"); The entire element is going invisible hence script throwing debug exception saying the element is invisible/not got the focus etc. Can anybody help me out on handling above is appreciated. Regards Sai

    Read the article

  • ExtJS: Add Single Click Action To A Node In A TreePanel

    - by FluidFoundation
    [revised] I'm creating a TreePanel in ExtJs that is loading its children from a JSON file. I'm having trouble adding a click action to the nodes. I'm not sure whether it's added in the script creating the tree, or if its added as a property in the JSON, and if so, what the syntax would be. Any help would be appreciated! Please provide an example if possible.

    Read the article

  • GWT-EXT tree xml Error

    - by ehab refaat
    i am new to GWT GWT-EXT and i mimic it's demo the problem is where i should put xml file final TreePanel treePanel = new TreePanel() { { setAnimate(true); setEnableDD(true); setContainerScroll(true); setRootVisible(true); } }; final XMLTreeLoader loader = new XMLTreeLoader() { { setDataUrl("countries-cb.xml"); setMethod("get"); setRootTag("countries"); setFolderIdMapping("@id"); setLeafIdMapping("@id"); setFolderTitleMapping("@title"); setFolderTag("team"); setLeafTitleMapping("@title"); setLeafTag("country"); setQtipMapping("@qtip"); setDisabledMapping("@disabled"); setCheckedMapping("@checked"); setIconMapping("@icon"); setAttributeMappings(new String[]{"@rank"}); } }; AsyncTreeNode root = new AsyncTreeNode("Countries", loader); treePanel.setRootNode(root); treePanel.render(); root.expand(); treePanel.expandAll();

    Read the article

  • Extjs: Tree, Selecting node after creating the tree

    - by Natkeeran
    I have a simple TreePanel. I would like to select a particular node upon loading it. The nodes are from a remote file (json). The tree is loading as expected. However, the node is not being selected. Firebug shows node as undefined. This perhaps because of the async property. But, I an unable to configure this other wise, or specify the node be selected. Any suggestions welcomed, and thank you. LeftMenuTree = new Ext.tree.TreePanel({ renderTo: 'TreeMenu', collapsible: false, height: 450, border: false, userArrows: true, animate: true, autoScroll: true, id: 'testtest', dataUrl: fileName, root: { nodeType: 'async', iconCls:'home-icon', expanded:true, text: rootText }, listeners: { "click": { fn: onPoseClick, scope: this } }, "afterrender": { fn: setNode, scope: this } }); function setNode(){ alert (SelectedNode); if (SelectedNode == "Orders"){ var treepanel = Ext.getCmp('testtest'); var node = treepanel.getNodeById("PendingItems"); node.select(); } }

    Read the article

  • ExtJS data store for tree

    - by drewda
    I've got a basic ExtJS question, which I can't seem to resolve based on reading the docs and searching. Currently I have a TreePanel that loads JSON directly from a URL. I'm trying to separate the data from the view, so that I can also use that data to feed into an OpenLayers map (using GeoExt). How can I point a TreePanel to an Ext.data.Store rather than to a URL?

    Read the article

  • Return extra data besides tree data from ExtJS TreeLoader dataUrl?

    - by Chad Johnson
    I asked this question in the Ext JS forums, but I received no responses, so I am asking here. I have a TreePanel (code below) that uses a TreeLoader and an AsyncTreeNode. In my API method specified by the TreeLoader's dataUrl, I return a JSON array to populate the tree. This works great, of course. However, I need to return an additional item--an integer--in addition to the array, and I need to display that value somewhere else in my UI. Is this possible? If not, what else would be a good solution? Here's the code I have currently: tree = new Ext.tree.TreePanel({ enableDD: true, rootVisible: false, useArrows: true, loader: new Ext.tree.TreeLoader({ dataUrl: '/api/method' }), root: new Ext.tree.AsyncTreeNode() });

    Read the article

  • Programmatically change an EditorGrid's cell value

    - by Snowright
    Hi, I have an Editor Grid where if a specific cell is in focus (is being edited), a window containing a tree panel pops up allowing the user to choose a node from the treepanel as the new value of the cell. This way, the user isn't actually editing the cell in question, but is using the window to choose the new value. However, I am having difficulties setting the value of the cell in question programmatically. Below is the code I use to set the grid up, including the column model that chooses what editor to use for a cell depending on the value type: var editorCM = new Ext.grid.ColumnModel({ //config ,editors : { //rest of editors 'id' : new Ext.grid.GridEditor(new Ext.form.TextField({readOnly : true})) } ,getCellEditor : function(col, row) { //choose editor depending on the type value of a cell } }) var editorGrid = new Ext.grid.EditorGridPanel({ //rest of config ,cm : editorCM }) Below is my code to change the cell's value once the user chooses from the treepanel. function submitNode(newValue) { var temp = editorGrid.GetSelectionModel().getSelectedCell(); //returns array containing column and row position of selected cell, which value we want to change. //temp[1] = column index, temp[0] = row index //Gets the cell editor at specific position and sets new value for that cell editorGrid.getColumnModel().getCellEditor(temp[1], temp[0]).setValue(newValue); } I've also tried a few other ways (all including setValue(newValue)), but have come up empty handed. I've looked through the API and the ExtJS forums for any clue but have also come up empty handed.

    Read the article

  • Mistake in the Code

    - by vibha
    myTree.on('click',function(node){ if(node.isLeaf()) { Ext.Msg.alert("You are in value ",nodeValue,"whose name is",nodeName); alert("You are in value ",nodeValue,"whose name is",nodeName); } }); myTree is a TreePanel. I'm getting a tree but click function is not working. I'm very new to extjs. Help me out. Thanks in advance

    Read the article

  • EXT JS toLayout on Viewport doesnt show anything...

    - by Nazariy
    After reading many example about adding new components in to existing container without reloading whole page I run in to small problem while combining tree and tabs inside Viewport component. What I'm trying to do is to register on click event to tree node and load in to content container new component, depending on node type it can be tabpanel, gridpanel or any other available component. here is short example of tree object: { xtype: 'treepanel', id: 'tree-panel', listeners: { click: function(n) { var content = Ext.getCmp('content-panel'); content.setTitle(n.attributes.qtip); //remove all components from content-panel content.removeAll(); content.add(dummy_tabs2); content.doLayout(); return; } }} All DOM manipulation went fine, everything registered properly, new Title shown, but dummy_tabs2 are not shown. I did try to set various properties for doLayout(true|false, true|false) but nothing happens. Am I doing something wrong?

    Read the article

  • In GWT-EXT checkboxtree how to handle single selection of tree nodes?

    - by RAS
    hi, I'm working on checkBoxTree in GWT-EXT 2.0.3 with Java. My aim is to get a selectionModel which allows me to select(check) only one TreeNode at a time. If I select another TreeNode after selecting one then, the previous one should be unchecked. I've tried using DefaultSelectionModel with TreePanel, but either I've not used it properly or it's working only for selection of TreeNode not for checking a TreeNode. Can anyone help me in this? Thanks in advance.

    Read the article

  • How to replace the image ?

    - by master123
    Below code displays the tree structure.When i click on the image Pic.gif,it has to get replaced by new image.Similarly pic1.gif to new image,pic6.gif to new image.Can you help mw with the code where exactly it fits in this code ???? var children = [{ text: 'family', icon: 'pic1.gif', children: [{ text: 'parent1', icon: 'pic2.gif', children: [{ icon: 'pic3.gif', text: 'children1', leaf: true}, { icon: 'pic4.gif', text: 'children2', leaf: true}, { icon: 'pic5.gif', text: 'children3', leaf: true}]}], }, { text: 'Parent2', icon: 'pic6.gif', children: [{ icon: 'pic7.gif', text: 'children4', leaf: true}, { icon: 'pic8.gif', text: 'children5', leaf: true}, { icon: 'pic9.gif', text: "children6", leaf: true}]}]; Ext.onReady(function() { var tree = new Ext.tree.TreePanel({ loader: new Ext.tree.TreeLoader(), width: 1000, height: 1000, renderTo: Ext.getBody(), root: new Ext.tree.AsyncTreeNode({ expanded: false, leaf: false, icon: 'pic.gif' , text: 'Head', children: children }) }); });

    Read the article

  • Ext JS Tab Panel - Dynamic Tabs - Tab Exists Not Working

    - by Joey Ezekiel
    Hi Would appreciate if somebody could help me on this. I have a Tree Panel whose nodes when clicked load a tab into a tab panel. The tabs are loading alright, but my problem is duplication. I need to check if a tab exists before adding it to the tab panel. I cant seem to have this resolved and it is eating my brains. This is pretty simple and I have checked stackoverflow and the EXT JS Forums for solutions but they dont seem to work for me or I'm being blind. This is my code for the tree: var opstree = new Ext.tree.TreePanel({ renderTo: 'opstree', border:false, width: 250, height: 'auto', useArrows: false, animate: true, autoScroll: true, dataUrl: 'libs/tree-data.json', root: { nodeType: 'async', text: 'Tool Actions' }, listeners: { render: function() { this.getRootNode().expand(); } } }) opstree.on('click', function(n){ var sn = this.selModel.selNode || {}; // selNode is null on initial selection renderPage(n.id); }); function renderPage(tabId) { var TabPanel = Ext.getCmp('content-tab-panel'); var tab = TabPanel.getItem(tabId); //Ext.MessageBox.alert('TabGet',tab); if(tab){ TabPanel.setActiveTab(tabId); } else{ TabPanel.add({ title: tabId, html: 'Tab Body ' + (tabId) + '', closable:true }).show(); TabPanel.doLayout(); } } }); and this is the code for the Tab Panel new Ext.TabPanel({ id:'content-tab-panel', region: 'center', deferredRender: false, enableTabScroll:true, activeTab: 0, items: [{ contentEl: 'about', title: 'About the Billing Ops Application', closable: true, autoScroll: true, margins: '0 0 0 0' },{ contentEl: 'welcomescreen', title: 'PBRT Application Home', closable: false, autoScroll: true, margins: '0 0 0 0' }] }) Can somebody please help?

    Read the article

  • ExtJs - Set a fixed width in a center layout in a Panel

    - by Benjamin
    Hi all, Using ExtJs. I'm trying to design a main which is divided into three sub panels (a tree list, a grid and a panel). The way it works is that you have a tree list (west) with elements, you click on an element which populates the grid (center), then you click on an element in the grid and that generates the panel (west). My main panel containing the three other ones has been defined with a layout 'border'. Now the problem I face is that the center layout (the grid) has been defined in the code with a fixed width and the west panel as an auto width. But when the interface gets generated, the grid width is suddenly taking all the space in the interface instead of the west panel. The code looks like that: var exploits_details_panel = new Ext.Panel({ region: 'east', autoWidth: true, autoScroll: true, html: 'test' }); var exploit_commands = new Ext.grid.GridPanel({ store: new Ext.data.Store({ autoDestroy: true }), sortable: true, autoWidth: false, region: 'center', stripeRows: true, autoScroll: true, border: true, width: 225, columns: [ {header: 'command', width: 150, sortable: true}, {header: 'date', width: 70, sortable: true} ] }); var exploits_tree = new Ext.tree.TreePanel({ border: true, region: 'west', width: 200, useArrows: true, autoScroll: true, animate: true, containerScroll: true, rootVisible: false, root: {nodeType: 'async'}, dataUrl: '/ui/modules/select/exploits/tree', listeners: { 'click': function(node) { } } }); var exploits = new Ext.Panel({ id: 'beef-configuration-exploits', title: 'Auto-Exploit', region: 'center', split: true, autoScroll: true, layout: { type: 'border', padding: '5', align: 'left' }, items: [exploits_tree, exploit_commands, exploits_details_panel] }); Here 'var exploits' is my main panel containing the three other sub panels. The 'exploits_tree' is the tree list containing some elements. When you click on one of the elements the grid 'exploit_commands' gets populated and when you click in one of the populated elements, the 'exploits_details_panel' panel gets generated. How can I set a fixed width on 'exploit_commands'? Thanks for your time.

    Read the article

1