Gelmiş geçmiş en büyük porno sitemiz olan 2pe de her zaman en kaliteli pornoları sunmayı hedefledik. Diğer video sitemiz olan vuam da ise hd porno ağırlıklı çalışmalara başladık.

  1. #1
    Sencha User
    Join Date
    Nov 2007
    Location
    Ukraine/US
    Posts
    12
    Vote Rating
    0
    dpasichnik is on a distinguished road

      0  

    Default Editable Column Tree example

    Editable Column Tree example


    Hi,

    I looked for it some time ago on this forum and didn't find, so I wrote it.

    It allows create, modify, delete and save Tree nodes either in XML or JSON (here it just alerts the resulted tree)

    Basically, I modified existing ColumnTree and treeSerialiser code. I'm pretty new to EXTJS so if I done something wrong - please correct it.

    editable-column-tree.js

    Code:
    /*
     * Ext JS Library 2.0 RC 1
     * Copyright(c) 2006-2007, Ext JS, LLC.
     * licensing@extjs.com
     * 
     * http://extjs.com/license
     */
    
    Ext.onReady(function(){
    	Ext.BLANK_IMAGE_URL = 'ext-2.0/resources/images/default/s.gif';
    		
        var tree = new Ext.tree.ColumnTree({
            el:'tree-ct',
            width:700,
            autoHeight:true,
            rootVisible:false,
            autoScroll:true,
    		expandable:false,
    		enableDD:true,
            title: 'Menu Configuration',
            tbar: [{
    				text:'Save Menu',
    				tooltip: 'Save Menu',
    				iconCls:'save-icon',
    				listeners: {
    					'click': function() {
    						var json = tree.toJsonString(null,
    							function(key, val) {
    								return (key == 'leaf' || key == 'id' || key =='menu_item'|| key == 'menu_url');
    							}, {
    								menu_item: 'text',
    								menu_url: 'href'
    							}
    						);
    						alert(json);
    					},
    					scope:this
    				}
    			},{
    				xtype:'tbseparator'
    			},{
    				text:'Add Folder Item',
    				tooltip: 'Add Folder Item',
    				iconCls:'folder-icon',
    				listeners: {
    					'click' : function(){
    						var selectedItem = tree.getSelectionModel().getSelectedNode();
    						if (!selectedItem) {
    							selectedItem = tree.getRootNode(); 
    						}
    					
    						handleCreate = function (btn, text, cBoxes){
    							if(btn == 'ok' && text) {
    								var newNode = new Ext.tree.TreeNode({
    										menu_item: text,
    										menu_url: '',
    										leaf: false,
    										expandable: true,
    										uiProvider: Ext.tree.ColumnNodeUI
    								});
    								if(selectedItem.isLeaf()) {
    									selectedItem.parentNode.insertBefore(newNode, selectedItem.nextSibling);
    								} else {
    									selectedItem.insertBefore(newNode, selectedItem.firstChild);
    								}
    							}
    						}
    						Ext.MessageBox.show({
    							title:'Add new Folder Item',
    							msg: 'Name of Folder Item:',
    							buttons: Ext.MessageBox.OKCANCEL,
    							prompt:true,
    							fn: handleCreate
    						});
    					}
    				}
    			},{
    				xtype:'tbseparator'
    			},{
    				text:'Add Page Item',
    				tooltip: 'Add Page Item',
    				iconCls:'page-icon',
    				listeners: {
    					'click' : function(){
    						var selectedItem = tree.getSelectionModel().getSelectedNode();
    						if (!selectedItem) {
    							Ext.Msg.alert('Warning', 'Please select an Item after which you want to add a new one.');
    							return false;
    						}
    					
    						handleCreate = function (btn, text, cBoxes){
    							if(btn == 'ok' && text) {
    								var newNode = new Ext.tree.TreeNode({
    										menu_item: text,
    										menu_url: '',
    										leaf: true,
    										allowChildren:false,
    										uiProvider: Ext.tree.ColumnNodeUI
    								});
    								if(selectedItem.isLeaf()) {
    									selectedItem.parentNode.insertBefore(newNode, selectedItem.nextSibling);
    								} else {
    									selectedItem.insertBefore(newNode, selectedItem.firstChild);
    								}
    							}
    						}
    						Ext.MessageBox.show({
    							title:'Add new Page Item',
    							msg: 'Name of Page Item:',
    							buttons: Ext.MessageBox.OKCANCEL,
    							prompt:true,
    							fn: handleCreate
    						});
    					}
    				}
    				
    			},{
    				xtype:'tbseparator'
    			},{
    				text:'Delete Item',
    				tooltip: 'Delete Item',
    				iconCls:'delete-icon',
    				listeners: {
    					'click' : function(){
    						var selectedItem = tree.getSelectionModel().getSelectedNode();
    						if (!selectedItem) {
    							Ext.Msg.alert('Warning', 'Please select an Item to delete.');
    							return false;
    						}
    					
    						handleDelete = function (btn){
    							if(btn == 'ok') {
    								selectedItem.remove();
    							}
    						}
    						Ext.MessageBox.show({
    							title:'Confirm your action',
    							msg: 'Are you sure you want to delete this item and its children?',
    							buttons: Ext.MessageBox.OKCANCEL,
    							fn: handleDelete
    						});
    					}
    				}
    			},{
    				xtype:'tbseparator'
    			}],
            columns:[{
                header:'Menu Item',
                width:300,
                dataIndex:'menu_item'
            },{
                header:'URL',
                width:398,
                dataIndex:'menu_url'
            }],
    
            loader: new Ext.tree.TreeLoader({
                preloadChildren:true,
                uiProviders:{
                    'col': Ext.tree.ColumnNodeUI
                }
            }),
    		
            root: new Ext.tree.AsyncTreeNode({
    				allowChildren: true,
    				children: [{
    				  menu_item: "Current State",
    				  menu_url: 'blah blah', 
    				  uiProvider:'col',
    				  children: [{
    					  menu_item: "Executive Summary",
    					  menu_url: 'blah blah', 
    					  uiProvider:'col',
    					  leaf:true
    				  },{
    					  menu_item: "Vulnerability Scorecard",
    					  menu_url: 'blah blah',
    					  uiProvider:'col',
    					  leaf:true
    				  },{
    					  menu_item: "Vulnerability Distribution",
    					  menu_url: 'blah blah',
    					  uiProvider:'col',
    					  leaf:true
    				  }]
    				},{
    					
    				  menu_item: "Trends",
    				  menu_url: 'blah blah',
    				  uiProvider:'col',
    				  children: [{
    					  menu_item: "Host Changes",
    					  menu_url: 'blah blah',
    					  uiProvider:'col',
    					  leaf:true
    				  },{
    					  menu_item: "Hosts and Vulnerability",
    					  menu_url: 'blah blah',
    					  uiProvider:'col', 
    					  leaf:true
    				  },{
    					  menu_item: "Application and Vulnerability",
    					  menu_url: 'blah blah',
    					  uiProvider:'col', 
    					  leaf:true
    				  },{
    					  menu_item: "Vulnerability by Operation System",
    					  menu_url: 'blah blah',
    					  uiProvider:'col', 
    					  leaf:true
    				  },{
    					  menu_item: "Vulnerability by Networks",
    					  menu_url: 'blah blah',
    					  uiProvider:'col', 
    					  leaf:true
    				  },{
    					  menu_item: "Vulnerability by Application Group",
    					  menu_url: 'blah blah',
    					  uiProvider:'col', 
    					  leaf:true
    				  }]
    				},{
    					
    				  menu_item: "Technical",
    				  menu_url: 'blah blah',
    				  uiProvider:'col', 
    				  children: [{
    					  menu_item: "Risk Matrix",
    					  menu_url: 'blah blah',
    					  uiProvider:'col', 
    					  leaf:true
    				  },{
    					  menu_item: "Host Inventory",
    					  menu_url: 'blah blah',
    					  uiProvider:'col', 
    					  leaf:true
    				  },{
    					  menu_item: "Application Inventory",
    					  menu_url: 'blah blah',
    					  uiProvider:'col', 
    					  leaf:true
    				  },{
    					  menu_item: "Vulnerability Inventory",
    					  menu_url: 'blah blah',
    					  uiProvider:'col', 
    					  leaf:true
    				  },{
    					  menu_item: "Most Common Vulnerabilites",
    					  menu_url: 'blah blah',
    					  uiProvider:'col', 
    					  leaf:true
    				  },{
    					  menu_item: "Most Common SANS Vulnerabilities",
    					  menu_url: 'blah blah',
    					  uiProvider:'col', 
    					  leaf:true
    				  },{
    					  menu_item: "Most Vulnerable Applications",
    					  menu_url: 'blah blah',
    					  uiProvider:'col', 
    					  leaf:true
    				  },{
    					  menu_item: "Most Vulnerable Hosts",
    					  menu_url: 'blah blah',
    					  uiProvider:'col', 
    					  leaf:true
    				  },{
    					  menu_item: "PCI Compliance",
    					  menu_url: 'blah blah',
    					  uiProvider:'col', 
    					  leaf:true
    				  }]
    				}]
    			})
        });
        tree.render();
    	tree.expandAll();
    	 var te = new Ext.tree.ColumnTreeEditor(tree,{
                    completeOnEnter: true,
                    autosize: true,
                    ignoreNoChange: true
                });
    });
    ColumnNodeUI.js

    Code:
    /*
     * Ext JS Library 2.0 RC 1
     * Copyright(c) 2006-2007, Ext JS, LLC.
     * licensing@extjs.com
     * 
     * http://extjs.com/license
     */
    
    Ext.tree.ColumnTree = Ext.extend(Ext.tree.TreePanel, {
        lines:false,
        borderWidth: Ext.isBorderBox ? 0 : 2, // the combined left/right border for each cell
        cls:'x-column-tree',
    	collapsible: false,
        
        onRender : function(){
            Ext.tree.ColumnTree.superclass.onRender.apply(this, arguments);
            this.headers = this.body.createChild(
                {cls:'x-tree-headers'},this.innerCt.dom);
    
            var cols = this.columns, c;
            var totalWidth = 0;
    
            for(var i = 0, len = cols.length; i < len; i++){
                 c = cols[i];
                 totalWidth += c.width;
                 this.headers.createChild({
                     cls:'x-tree-hd ' + (c.cls?c.cls+'-hd':''),
                     cn: {
                         cls:'x-tree-hd-text',
                         html: c.header
                     },
                     style:'width:'+(c.width-this.borderWidth)+'px;'
                 });
            }
            this.headers.createChild({cls:'x-clear'});
            // prevent floats from wrapping when clipped
            this.headers.setWidth(totalWidth);
            this.innerCt.setWidth(totalWidth);
        }
    });
    
    
    Ext.tree.ColumnNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
        focus: Ext.emptyFn, // prevent odd scrolling behavior
    
        renderElements : function(n, a, targetNode, bulkRender){
            this.indentMarkup = n.parentNode ? n.parentNode.ui.getChildIndent() : '';
    
            var t = n.getOwnerTree();
            var cols = t.columns;
            var bw = t.borderWidth;
            var c = cols[0];
    		
    		n.cols = new Array();
    		
    		var text = n.text || (c.renderer ? c.renderer(a[c.dataIndex], n, a) : a[c.dataIndex]);
    		n.cols[cols[0].dataIndex] = text;
    
            var buf = [
                 '<li class="x-tree-node" unselectable="on"><div ext:tree-node-id="',n.id,'" class="x-tree-node-el x-tree-node-leaf ', a.cls,'" unselectable="on">',
                    '<div class="x-tree-col" style="width:',c.width-bw,'px;" unselectable="on">',
                        '<span class="x-tree-node-indent" unselectable="on">',this.indentMarkup,"</span>",
                        '<img src="', this.emptyIcon, '" class="x-tree-ec-icon x-tree-elbow" unselectable="on">',
                        '<img src="', a.icon || this.emptyIcon, '" class="x-tree-node-icon',(a.icon ? " x-tree-node-inline-icon" : ""),(a.iconCls ? " "+a.iconCls : ""),'" unselectable="on">',
                        '<a hidefocus="on" class="x-tree-node-anchor" href="',a.href ? a.href : "#",'" tabIndex="1" ',
                        a.hrefTarget ? ' target="'+a.hrefTarget+'"' : "", ' unselectable="on">',
                        '<span unselectable="on">', text,"</span></a>",
                    "</div>"];
             for(var i = 1, len = cols.length; i < len; i++){
                 c = cols[i];
    			 var text = (c.renderer ? c.renderer(a[c.dataIndex], n, a) : a[c.dataIndex]);
    			 n.cols[cols[i].dataIndex] = text;
                 buf.push('<div class="x-tree-col ',(c.cls?c.cls:''),'" style="width:',c.width-bw,'px;" unselectable="on">',
                            '<div class="x-tree-col-text" unselectable="on">',text,"</div>",
                          "</div>");
             }
             buf.push(
                '<div class="x-clear" unselectable="on"></div></div>',
                '<ul class="x-tree-node-ct" style="display:none;" unselectable="on"></ul>',
                "</li>");
    
            if(bulkRender !== true && n.nextSibling && n.nextSibling.ui.getEl()){
                this.wrap = Ext.DomHelper.insertHtml("beforeBegin",
                                    n.nextSibling.ui.getEl(), buf.join(""));
            }else{
                this.wrap = Ext.DomHelper.insertHtml("beforeEnd", targetNode, buf.join(""));
            }
    
            this.elNode = this.wrap.childNodes[0];
            this.ctNode = this.wrap.childNodes[1];
            var cs = this.elNode.firstChild.childNodes;
            this.indentNode = cs[0];
            this.ecNode = cs[1];
            this.iconNode = cs[2];
            this.anchor = cs[3];
            this.textNode = cs[3].firstChild;
        }
    });
    Ext.tree.ColumnTreeEditor = function(tree, config){
        config = config || {};
        var field = config.events ? config : new Ext.form.TextField(config);
        Ext.tree.TreeEditor.superclass.constructor.call(this, field);
    
        this.tree = tree;
    
        if(!tree.rendered){
            tree.on('render', this.initEditor, this);
        }else{
            this.initEditor(tree);
        }
    };
    
    Ext.extend(Ext.tree.ColumnTreeEditor, Ext.Editor, {
        
        alignment: "l-l",
        autoSize: false,
        
        hideEl : false,
        
        cls: "x-small-editor x-tree-editor",
        
        shim:false,
        shadow:"frame",
        
        maxWidth: 250,
        
        editDelay: 0,
    
        initEditor : function(tree){
            tree.on('beforeclick', this.beforeNodeClick, this);
            this.on('complete', this.updateNode, this);
            this.on('beforestartedit', this.fitToTree, this);
            this.on('startedit', this.bindScroll, this, {delay:10});
            this.on('specialkey', this.onSpecialKey, this);
        },
    
            fitToTree : function(ed, el){
            var td = this.tree.getTreeEl().dom, nd = el.dom;
            if(td.scrollLeft >  nd.offsetLeft){             td.scrollLeft = nd.offsetLeft;
            }
            var w = Math.min(
                    this.maxWidth,
                    (td.clientWidth > 20 ? td.clientWidth : td.offsetWidth) - Math.max(0, nd.offsetLeft-td.scrollLeft) - 5);
            this.setSize(w, '');
        },
    
            triggerEdit : function(node, e){
            var obj = e.target;
    		if (Ext.select(".x-tree-node-anchor", false, obj).getCount() == 1) {
    			obj = Ext.select(".x-tree-node-anchor", false, obj).elements[0].firstChild;
    		} else if (obj.nodeName == 'SPAN' || obj.nodeName == 'DIV'){
    			obj = e.target;
    		} else {
    			return false;
    		}
    				
    		var colIndex = 0;
    		for (var i in node.cols) {
    			if (node.cols[i] == obj.innerHTML) {
    				colIndex = i;
    			}
    		}
    		this.completeEdit();
    		this.editNode = node;
    		this.editCol = obj;
    		this.editColIndex = colIndex;
    		this.startEdit(obj);
    		if (obj.nodeName == 'DIV') {
    			var width = obj.offsetWidth;
    			this.setSize(width);
    		}
        },
    
            bindScroll : function(){
            this.tree.getTreeEl().on('scroll', this.cancelEdit, this);
        },
    
            beforeNodeClick : function(node, e){
            var sinceLast = (this.lastClick ? this.lastClick.getElapsed() : 0);
            this.lastClick = new Date();
            if(sinceLast > this.editDelay && this.tree.getSelectionModel().isSelected(node)){
                e.stopEvent();
                this.triggerEdit(node, e);
                return false;
            } else {
    			this.completeEdit();
    		}
        },
    
            updateNode : function(ed, value){
            this.tree.getTreeEl().un('scroll', this.cancelEdit, this);
            this.editNode.cols[this.editColIndex] = value; //for internal use only
    		this.editNode.attributes[this.editColIndex] = value;//duplicate into array of node attributes
    		this.editCol.innerHTML = value;
        },
    
            onHide : function(){
            Ext.tree.TreeEditor.superclass.onHide.call(this);
            if(this.editNode){
                this.editNode.ui.focus();
            }
        },
    
            onSpecialKey : function(field, e){
            var k = e.getKey();
            if(k == e.ESC){
                e.stopEvent();
                this.cancelEdit();
            }else if(k == e.ENTER && !e.hasModifier()){
                e.stopEvent();
                this.completeEdit();
            }
        }
    });
    editable-column-tree.html

    HTML Code:
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Menu Configuration</title>
    <link rel="stylesheet" type="text/css" href="ext-2.0/resources/css/ext-all.css" />
    
        <!-- GC -->
     	<!-- LIBS -->
     	<script type="text/javascript" src="ext-2.0/adapter/ext/ext-base.js"></script>
     	<!-- ENDLIBS -->
    
        <script type="text/javascript" src="ext-2.0/ext-all.js"></script>
    
        <script type="text/javascript" src="ColumnNodeUI.js"></script>
        <script type="text/javascript" src="editable-column-tree.js"></script>
    	<script type="text/javascript" src="treeSerializer.js"></script>
    
        <link rel="stylesheet" type="text/css" href="editable-column-tree.css" />
    </head>
    <body>
    <table border="0" width="100%" height="100%">
    	<tr>
    		<td align="center" valign="top" style="padding-top:25px;">
    		<div id="tree-ct" style="text-align:left"></div>
    		</td>
    	</tr>
    </table>
    
    </body>
    </html>
    editable-column-tree.css

    Code:
    /*
     * Ext JS Library 2.0 RC 1
     * Copyright(c) 2006-2007, Ext JS, LLC.
     * licensing@extjs.com
     * 
     * http://extjs.com/license
     */
    
    .x-column-tree .x-tree-node {
        zoom:1;
    }
    .x-column-tree .x-tree-node-el {
        /*border-bottom:1px solid #eee; borders? */
        zoom:1;
    }
    .x-column-tree .x-tree-selected {
        background: #d9e8fb;
    }
    .x-column-tree  .x-tree-node a {
        line-height:18px;
        vertical-align:middle;
    }
    .x-column-tree  .x-tree-node a span{
    	
    }
    .x-column-tree  .x-tree-node .x-tree-selected a span{
    	background:transparent;
    	color:#000;
    }
    .x-tree-col {
        float:left;
        overflow:hidden;
        padding:0 1px;
        zoom:1;
    }
    
    .x-tree-col-text, .x-tree-hd-text {
        overflow:hidden;
        -o-text-overflow: ellipsis;
    	text-overflow: ellipsis;
        padding:3px 3px 3px 5px;
        white-space: nowrap;
    	height:1.2em;//height:20px;
        font:normal 11px arial, tahoma, helvetica, sans-serif;
    }
    .x-tree-hd-text {
    	height:1.3em;//height:20px;
    }
    
    .x-tree-headers {
        background: #f9f9f9 url(ext-2.0/resources/images/default/grid/grid3-hrow.gif) repeat-x 0 bottom;
    	cursor:default;
        zoom:1;
    }
    
    .x-tree-hd {
        float:left;
        overflow:hidden;
        border-left:1px solid #eee;
        border-right:1px solid #d0d0d0;
    }
    
    .page-icon {
        background-image:url(images/leaf-add-icon.gif) !important;
    }
    .delete-icon {
        background-image:url(images/delete-icon.gif) !important;
    }
    .folder-icon {
        background-image:url(images/folder-add-icon.gif) !important;
    }
    .save-icon {
        background-image:url(images/save-icon.gif) !important;
    }
    treeSerializer.js

    Code:
    /* tostring.js */
    
    /**
     * Returns a string of Json that represents the tree
     * @param {Function} (optional) A function, which when passed the node, returns true or false to include
     * or exclude the node.
     * @param {Function} (optional) A function, which when passed an attribute name, and an attribute value,
     * returns true or false to include or exclude the attribute.
     * @return {String}
     */
    Ext.tree.TreePanel.prototype.toJsonString = function(nodeFilter, attributeFilter, attributeMapping){
          return this.getRootNode().toJsonString(nodeFilter, attributeFilter, attributeMapping);
    };
    
    /**
     * Returns a string of Json that represents the node
     * @param {Function} (optional) A function, which when passed the node, returns true or false to include
     * or exclude the node.
     * @param {Function} (optional) A function, which when passed an attribute name, and an attribute value,
     * returns true or false to include or exclude the attribute.
     * @return {String}
     */
    Ext.tree.TreeNode.prototype.toJsonString = function(nodeFilter, attributeFilter, attributeMapping){
    //	Exclude nodes based on caller-supplied filtering function
        if (nodeFilter && (nodeFilter(this) == false)) {
            return '';
        }
        var c = false, result = "{";
    
    //	Add the id attribute unless the attribute filter rejects it.
        if (!attributeFilter || attributeFilter("id", this.id)) {
            result += '"id:"' + this.id;
            c = true;
        }
    
    //	Add all user-added attributes unless rejected by the attributeFilter.
        for(var key in this.attributes) {
            if ((key != 'id') && (!attributeFilter || attributeFilter(key, this.attributes[key]))) {
    	        if (c) result += ',';
    			if (attributeMapping && attributeMapping[key]) {
    				thisKey = attributeMapping[key];
    			} else {
    				thisKey = key;
    			}
    	        result += '"' + thisKey + '":"' + this.attributes[key] + '"';
    	        c = true;
    	    }
        }
    
    //	Add child nodes if any
        var children = this.childNodes;
        var clen = children.length;
        if(clen != 0){
            if (c) result += ',';
            result += '"children":['
            for(var i = 0; i < clen; i++){
                if (i > 0) result += ',';
                result += children[i].toJsonString(nodeFilter, attributeFilter, attributeMapping);
            }
            result += ']';
        }
        return result + "}";
    };
    
    /**
     * Returns a string of XML that represents the tree
     * @param {Function} (optional) A function, which when passed the node, returns true or false to include
     * or exclude the node.
     * @param {Function} (optional) A function, which when passed an attribute name, and an attribute value,
     * returns true or false to include or exclude the attribute.
     * @return {String}
     */
    Ext.tree.TreePanel.prototype.toXmlString = function(nodeFilter, attributeFilter, attributeMapping){
    	return '\u003C?xml version="1.0"?>\u003Ctree>' +
    		this.getRootNode().toXmlString(nodeFilter, attributeFilter, attributeMapping) +
    		'\u003C/tree>';
    };
    
    /**
     * Returns a string of XML that represents the node
     * @param {Function} (optional) A function, which when passed the node, returns true or false to include
     * or exclude the node.
     * @param {Function} (optional) A function, which when passed an attribute name, and an attribute value,
     * returns true or false to include or exclude the attribute.
     * @return {String}
     */
    Ext.tree.TreeNode.prototype.toXmlString = function(nodeFilter, attributeFilter, attributeMapping){
    //	Exclude nodes based on caller-supplied filtering function
        if (nodeFilter && (nodeFilter(this) == false)) {
            return '';
        }
        var result = '\u003Cnode';
    
    //	Add the id attribute unless the attribute filter rejects it.
        if (!attributeFilter || attributeFilter("id", this.id)) {
            result += ' id="' + this.id + '"';
        }
    
    //	Add all user-added attributes unless rejected by the attributeFilter.
        for(var key in this.attributes) {
            if ((key != 'id') && (!attributeFilter || attributeFilter(key, this.attributes[key]))) {
    	        if (attributeMapping && attributeMapping[key]) {
    				thisKey = attributeMapping[key];
    			} else {
    				thisKey = key;
    			}
    			result += ' ' + thisKey + '="' + this.attributes[key] + '"';
    	    }
        }
    
    //	Add child nodes if any
        var children = this.childNodes;
        var clen = children.length;
        if(clen == 0){
            result += '/>';
        }else{
            result += '>';
            for(var i = 0; i < clen; i++){
                result += children[i].toXmlString(nodeFilter, attributeFilter, attributeMapping);
            }
            result += '\u003C/node>';
        }
        return result;
    };

  2. #2
    Sencha User
    Join Date
    Nov 2007
    Location
    Ukraine/US
    Posts
    12
    Vote Rating
    0
    dpasichnik is on a distinguished road

      0  

    Default Editable Column Tree screenshot

    Editable Column Tree screenshot


    Here is screenshot.
    Attached Images

  3. #3
    Sencha User
    Join Date
    Nov 2007
    Location
    Ukraine/US
    Posts
    12
    Vote Rating
    0
    dpasichnik is on a distinguished road

      0  

    Default


    Does anybody know how to disable extpanding/collapsing of the tree? It's bothering me for this usecase..

  4. #4
    Ext User
    Join Date
    Jan 2008
    Posts
    2
    Vote Rating
    0
    tdv is on a distinguished road

      0  

    Default


    misprint found: (in ColumnNodeUI.js when you extending TreeEditor to ColumnTreeEditor)
    your code: Ext.extend(Ext.tree.ColumnTreeEditor, Ext.Editor, {
    should be: Ext.extend(Ext.tree.ColumnTreeEditor, Ext.tree.TreeEditor, {

  5. #5
    Sencha User
    Join Date
    Nov 2007
    Location
    Ukraine/US
    Posts
    12
    Vote Rating
    0
    dpasichnik is on a distinguished road

      0  

    Default


    No, it's Editor, not TreeEditor

  6. #6

  7. #7
    Ext User
    Join Date
    Mar 2008
    Posts
    22
    Vote Rating
    0
    andrasz is on a distinguished road

      0  

    Default


    Thank you for this script, dpasichnik.
    How can you make some columns uneditable ?
    The "save" button doesn't work for me. I think it should display an js alert with the "json tree" in it. But nothing happens. Do you have an idea ?
    TIA
    andrasz

    Edit : concerning the "save" button, I can't make the alert() function work inside a listener function. Anyway I used a messageBox instead and the json tree is well displayed. I still have to send it to the server through AJAX.

    I still have not idea about making some columns not editable.
    Last edited by andrasz; 19 Mar 2008 at 9:28 AM. Reason: precisions

  8. #8
    Ext User
    Join Date
    Nov 2007
    Posts
    7
    Vote Rating
    0
    astorne is on a distinguished road

      0  

    Thumbs up


    Code:
    		var colIndex = 0;
    		for (var i in node.cols) {
    			if (node.cols[i] == obj.innerHTML) {
    				colIndex = i;
    			}
    		}
    these codes to verify which column is to be edited , but it return error column(the last column) when some columns have the same content( for example: blank string value)?
    Last edited by astorne; 20 Mar 2008 at 3:44 AM. Reason: will

  9. #9
    Ext User
    Join Date
    Nov 2007
    Posts
    7
    Vote Rating
    0
    astorne is on a distinguished road

      0  

    Default


    Quote Originally Posted by andrasz View Post
    Thank you for this script, dpasichnik.
    How can you make some columns uneditable ?
    The "save" button doesn't work for me. I think it should display an js alert with the "json tree" in it. But nothing happens. Do you have an idea ?
    TIA
    andrasz

    Edit : concerning the "save" button, I can't make the alert() function work inside a listener function. Anyway I used a messageBox instead and the json tree is well displayed. I still have to send it to the server through AJAX.

    I still have not idea about making some columns not editable.
    if one column's value is "", the column is uneditable

  10. #10
    Ext User
    Join Date
    Mar 2008
    Posts
    89
    Vote Rating
    0
    Shaguar is on a distinguished road

      0  

    Default


    Where do i get the images from?
    (leaf-add-icon.gif)
    (delete-icon.gif)
    (folder-add-icon.gif)
    etc...