Mega Code Archive

 
Categories / JavaScript DHTML / Ext JS
 

Column tree

<!-- /*!  * Ext JS Library 3.0.0  * Copyright(c) 2006-2009 Ext JS, LLC  * licensing@extjs.com  * http://www.extjs.com/license  */   -->  <!-- Revised from Ext JS Library 3.0.0 -->  <html> <head> <title>Hello World Window</title> <link rel="stylesheet" type="text/css" href="ext-3.0.0/resources/css/ext-all.css" /> <script type="text/javascript" src="ext-3.0.0/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="ext-3.0.0/ext-all.js"></script>     <link rel="stylesheet" type="text/css" href="ext-3.0.0/examples/ux/css/ColumnNodeUI.css" />     <script type="text/javascript" src="ext-3.0.0/examples/ux/ColumnNodeUI.js"></script> <script> /*!  * Ext JS Library 3.0.0  * Copyright(c) 2006-2009 Ext JS, LLC  * licensing@extjs.com  * http://www.extjs.com/license  */ Ext.onReady(function(){     var tree = new Ext.ux.tree.ColumnTree({         width: 550,         height: 300,         rootVisible:false,         autoScroll:true,         title: 'Example Tasks',         renderTo: Ext.getBody(),         columns:[{             header:'Task',             width:330,             dataIndex:'task'         },{             header:'Duration',             width:100,             dataIndex:'duration'         },{             header:'Assigned To',             width:100,             dataIndex:'user'         }],         loader: new Ext.tree.TreeLoader({             dataUrl:'ext-3.0.0/examples/tree/column-data.json',             uiProviders:{                 'col': Ext.ux.tree.ColumnNodeUI             }         }),         root: new Ext.tree.AsyncTreeNode({             text:'Tasks'         })     }); }); </script> </head> <body>     <h1>ColumnTree Example</h1> </body> </html>