Upgrade to ExtJS 4.0.0 - Released 04/26/2011

[extjs.git] / examples / multiselect / multiselect-demo.html
diff --git a/examples/multiselect/multiselect-demo.html b/examples/multiselect/multiselect-demo.html

index dbe5ae2..6169c8e 100644 (file)
--- a/examples/multiselect/multiselect-demo.html
+++ b/examples/multiselect/multiselect-demo.html
@@ -1,31 +1,37 @@
+<!DOCTYPE html>
  <html>
  <head>
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
      <title>MultiSelect &amp; ItemSelector</title>
+
+    <!-- ExtJS -->
      <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
-    <link rel="stylesheet" type="text/css" href="../ux/css/MultiSelect.css"/>
-    <link rel="stylesheet" type="text/css" href="../shared/examples.css" />
-    
-    <script type="text/javascript" src="../../adapter/ext/ext-base.js"> </script>
-    <script type="text/javascript" src="../../ext-all.js"> </script>
+    <script type="text/javascript" src="../../bootstrap.js"></script>
  
-    <script type="text/javascript" src="../ux/MultiSelect.js"></script>
-    <script type="text/javascript" src="../ux/ItemSelector.js"></script>
-    
+    <!-- Shared -->
+    <link rel="stylesheet" type="text/css" href="../shared/example.css" />
+
+    <!-- Example -->
      <script type="text/javascript" src="multiselect-demo.js"></script>
-    <script type="text/javascript" src="../shared/examples.js"></script>
+    <link rel="stylesheet" type="text/css" href="../ux/css/ItemSelector.css" />
+
  </head>
  <body>
      <h1>MultiSelect &amp; ItemSelector</h1>
      <p>The js is not minified so it is readable. See <a href="multiselect-demo.js">multiselect-demo.js</a>.</p>
      
-    <b>MultiSelect</b><br />
-
-    <p>Press Save with no items selected to see an example of validation applied.</p>
-    <div id="multiselect" class="demo-ct" style="margin-bottom:15px;"></div>
+    <h2>MultiSelect</h2>
+    <p>MultiSelect is a form field type that allows selection of one or more items from a list. The list is
+    populated using a data Store. Items can be reordered via drag and drop if <code>ddReorder:true</code> is set.</p>
+    <p>This example has <code>allowBlank:false</code> so a validation error will appear when the item's selections
+    are cleared. Validations for <code>minSelections</code> and <code>maxSelections</code> can also be applied.</p>
+    <div id="multiselect" class="demo-ct"></div>
      
-    <b>ItemSelector</b><br />
-    <p>Supports drag and drop, double-click, button move/reorder, etc.
+    <h2>ItemSelector</h2>
+    <p>ItemSelector is a specialized MultiSelect field that renders as a pair of MultiSelect field, one with
+    available options and the other with selected options. A set of buttons in between allows items to be
+    moved between the fields and reordered within the selection. Items can also be moved via drag and drop.
+    All the same validations as MultiSelect are supported.</p>
      <div id="itemselector" class="demo-ct"></div>
  </body>
  </html>