Upgrade to ExtJS 4.0.0 - Released 04/26/2011

[extjs.git] / examples / tree / treegrid.html
diff --git a/examples/tree/treegrid.html b/examples/tree/treegrid.html

new file mode 100644 (file)

index 0000000..ace1330
--- /dev/null
+++ b/examples/tree/treegrid.html
@@ -0,0 +1,51 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
+<html>
+    <head>
+        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+        <title>
+            TreeGrid Example
+        </title>
+        <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css">
+        <link rel="stylesheet" type="text/css" href="../shared/example.css">
+        <script type="text/javascript" src="../../bootstrap.js"></script>
+        <script type="text/javascript" src="treegrid.js"></script>
+        <style type="text/css">
+            .task {
+                background-image: url(../shared/icons/fam/cog.gif) !important;
+            }
+            .task-folder {
+                background-image: url(../shared/icons/fam/folder_go.gif) !important;
+            }
+        </style>
+    </head>
+    <body>
+        <h1>
+            TreeGrid Example
+        </h1>
+        <p>
+            This example is an advanced tree example. It illustrates:
+        </p>
+        <ul class="feature-list">
+            <li>Multiple headers
+            </li>
+            <li>Preloading of nodes with a single AJAX request
+            </li>
+            <li>Header hiding, showing, reordering and resizing
+            </li>
+            <li>useArrows configuration
+            </li>
+            <li>Keyboard Navigation
+            </li>
+            <li>Discontinguous selection by holding the CTRL key
+            </li>
+            <li>Using custom iconCls
+            </li>
+            <li>singleExpand has been set to true
+            </li>
+        </ul>
+        <p>
+            Note that the js is not minified so it is readable. See <a href="treegrid.js">treegrid.js</a>.
+        </p>
+        <div id="tree-example"></div>
+    </body>
+</html>