git.pond.sub.org Git - eow/blob - static/dojo-release-1.1.1/dijit/tests/form/test_Spinner.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   2                 "http://www.w3.org/TR/html4/strict.dtd">
   3 <html>
   4         <head>
   5                 <title>Dojo Spinner Widget Test</title>
   6
   7                 <style type="text/css">
   8                         @import "../../../dojo/resources/dojo.css";
   9                         @import "../css/dijitTests.css";
  10                         .dj_ie INPUT#integerspinner2 { font-family: Courier; } /* help IE with font inheritance */
  11                 </style>
  12
  13                 <script type="text/javascript" src="../../../dojo/dojo.js"
  14                         djConfig="isDebug: true, parseOnLoad: true, extraLocale: ['de-de', 'en-us']"></script>
  15                 <script type="text/javascript" src="../_testCommon.js"></script>
  16
  17                 <script type="text/javascript">
  18                         dojo.require("dijit.form.NumberSpinner");
  19                         dojo.require("dojo.parser"); // scan page for widgets
  20                 </script>
  21         </head>
  22
  23         <body>
  24         <h1 class="testTitle">Dijit Spinner Test</h1>
  25                 Try typing values, and use the up/down arrow keys and/or the arrow push
  26                 buttons to spin
  27                 <br>
  28         <form id="form1" action="" name="example" method="post">
  29                 <h1>number spinner</h1>
  30                 <br>
  31                 initial value=900, no delta specified, no min specified, max=1550, onChange captured<br>
  32                 <label for="integerspinner1">Spinbox #1: </label><br>
  33                 <input dojoType="dijit.form.NumberSpinner"
  34                         onChange="dojo.byId('oc1').value=arguments[0]"
  35                         value="900"
  36                         class="medium"
  37                         constraints="{max:1550,places:0}"
  38                         name="integerspinner1"
  39                         id="integerspinner1">
  40                 onChange:<input id="oc1" disabled value="not fired yet!" autocomplete="off">
  41                 <br>
  42                 <br>
  43                 initial value=1000, delta=10, min=9 max=1550<br>
  44                 <label for="integerspinner2">Spinbox with custom styling (width=50%, 200% Courier font): </label>
  45                 <input dojoType="dijit.form.NumberSpinner"
  46                         style="font-size:200%;font-family:Courier;border:1px solid blue;width:50%;"
  47                         value="1000"
  48                         smallDelta="10"
  49                         constraints="{min:9,max:1550,places:0}"
  50                         name="integerspinner2"
  51                         id="integerspinner2">
  52                 <br>
  53                 <br>
  54                 <label for="integertextbox3">Spinner line break test: </label>initial value not specified, delta not specified, min not specified, max not specified, signed not specified, separator not specified<br>
  55                 [verify no line break just after this text]
  56                 <input dojoType="dijit.form.NumberSpinner" name="integertextbox3" id="integertextbox3">
  57                 [verify no line break just before this text]
  58                 <br>
  59                 <br>
  60                 Move the cursor left and right within the input field to see the effect on the spinner.
  61                 <br>
  62                 initial value=+1.0, delta=0.1, min=-10.9, max=155, places=1, maxLength=20<br>
  63                 <label for="realspinner1">Real Number Spinbox #1: </label><br>
  64                 <input dojoType="dijit.form.NumberSpinner"
  65                         value="1.0"
  66                         smallDelta="0.1"
  67                         constraints={min:-10.9,max:155,places:1,round:true}
  68                         maxLength="20"
  69                         name="realspinner1"
  70                         id="realspinner1">
  71                 <br>
  72
  73 <script>
  74                 function displayData() {
  75                                 var f = document.getElementById("form1");
  76                                 var s = "";
  77                                 for (var i = 0; i < f.elements.length; i++) {
  78                                                 var elem = f.elements[i];
  79                                                 if (elem.name == "button")  { continue; }
  80                                                 s += elem.name + ": " + elem.value + "\n";
  81                                 }
  82                                 alert(s);
  83                 }
  84 </script>
  85                 <div>
  86                         <button name="button" onclick="displayData(); return false;">view data</button>
  87                         <input type="submit" name="submit" />
  88                 </div>
  89
  90         </form>
  91         </body>
  92 </html>