git.pond.sub.org Git - eow/blob - static/dojo-release-1.1.1/dojo/tests/dnd/test_form.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
   2 <html>
   3 <head>
   4         <title>Dojo DnD form test</title>
   5         <style type="text/css">
   6                 @import "../../resources/dojo.css";
   7                 @import "../../resources/dnd.css";
   8                 @import "dndDefault.css";
   9
  10                 body {
  11                         padding: 1em;
  12                         background:#ededed;
  13                 }
  14
  15                 #container1,#container2 { width:300px; display:block; }
  16                 .clear { clear:both; }
  17
  18         </style>
  19
  20         <script type="text/javascript" src="../../dojo.js" djConfig="isDebug: true, parseOnLoad: true"></script>
  21
  22         <script type="text/javascript" src="../../dnd/Container.js"></script>
  23         <script type="text/javascript" src="../../dnd/Selector.js"></script>
  24         <script type="text/javascript" src="../../dnd/Source.js"></script>
  25         <script type="text/javascript" src="../../dnd/Avatar.js"></script>
  26         <script type="text/javascript" src="../../dnd/Manager.js"></script>
  27
  28         <script type="text/javascript">
  29                 dojo.require("dojo.parser");
  30                 //dojo.require("dojo.dnd.Source");
  31                 //dojo.require("dojo.dnd.Manager");
  32
  33                 var c1, c2;
  34
  35                 function init(){
  36
  37                         c1 = new dojo.dnd.Source("container1");
  38                         c1.insertNodes(false, [1, 2, 3, 4, 5, 6, [1, 2, 3], function(x){ return x + x; }]);
  39                         c2 = new dojo.dnd.Target("container2", {accept: ["money"]});
  40
  41                         // example subscribe to events
  42                         dojo.subscribe("/dnd/start",function(foo){
  43                                 console.debug(foo);
  44                         });
  45
  46                 };
  47                 dojo.addOnLoad(init);
  48         </script>
  49 </head>
  50 <body>
  51         <h1 class="testTitle">Dojo DnD form test</h1>
  52
  53         <p>This is a test to confirm that the DnD container does not interfere with form elements.</p>
  54
  55         <div id="dragLists">
  56
  57                 <div style="float:left; margin:5px; ">
  58                         <h3>Target 1</h3>
  59                         <p id="container1" class="container"></p>
  60                 </div>
  61
  62                 <div style="float:left; margin:5px; ">
  63                         <h3>Target 2: form controls galore</h3>
  64                         <form id="container2" class="container" action="http://dojotoolkit.org">
  65                                 Input text: <input type="text" /><br />
  66                                 Input checkbox: <input type="checkbox" /><br />
  67                                 Input radio: <input type="radio" /><br />
  68                                 Input password: <input type="password" /><br />
  69                                 Input file: <input type="file" /><br />
  70                                 Input button: <input type="button" value="Button" /><br />
  71                                 Input reset: <input type="reset" /><br />
  72                                 Input submit: <input type="submit" /><br />
  73                                 Input image: <input type="image" src="http://dojotoolkit.org/misc/feed.png" /><br />
  74                                 Button: <button>Button</button><br />
  75                                 Select: <select><option>Yes</option><option>No</option></select><br />
  76                                 Textarea: <textarea cols="20" rows="3">Some text.</textarea>
  77                         </form>
  78                 </div>
  79                 <div class="clear"></div>
  80         </div>
  81
  82         <p>&nbsp;</p>
  83
  84         <div dojoType="dojo.dnd.Source" class="container">
  85                 <div>Source with <strong>skipForm = false</strong> (by default)</div>
  86                 <div class="dojoDndItem">Item <strong>X</strong>: <input type="text" value="1" /></div>
  87                 <div class="dojoDndItem">Item <strong>Y</strong>: <input type="text" value="2" /></div>
  88                 <div class="dojoDndItem">Item <strong>Z</strong>: <input type="text" value="3" /></div>
  89         </div>
  90
  91         <p>&nbsp;</p>
  92
  93         <div dojoType="dojo.dnd.Source" class="container" skipForm="true">
  94                 <div>Source with <strong>skipForm = true</strong></div>
  95                 <div class="dojoDndItem">Item <strong>A</strong>: <input type="text" value="a" /></div>
  96                 <div class="dojoDndItem">Item <strong>B</strong>: <input type="text" value="b" /></div>
  97                 <div class="dojoDndItem">Item <strong>C</strong>: <input type="text" value="c" /></div>
  98         </div>
  99
 100         <p>HTML after</p>
 101
 102 </body>
 103 </html>