third-party/jquery-ui-1.10.2/demos/spinner/decimal.html

   1 <!doctype html>
   2 <html lang="en">
   3 <head>
   4         <meta charset="utf-8">
   5         <title>jQuery UI Spinner - Decimal</title>
   6         <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
   7         <script src="../../jquery-1.9.1.js"></script>
   8         <script src="../../external/jquery.mousewheel.js"></script>
   9         <script src="../../external/globalize.js"></script>
  10         <script src="../../external/globalize.culture.de-DE.js"></script>
  11         <script src="../../external/globalize.culture.ja-JP.js"></script>
  12         <script src="../../ui/jquery.ui.core.js"></script>
  13         <script src="../../ui/jquery.ui.widget.js"></script>
  14         <script src="../../ui/jquery.ui.button.js"></script>
  15         <script src="../../ui/jquery.ui.spinner.js"></script>
  16         <link rel="stylesheet" href="../demos.css">
  17         <script>
  18         $(function() {
  19                 $( "#spinner" ).spinner({
  20                         step: 0.01,
  21                         numberFormat: "n"
  22                 });
  23
  24                 $( "#culture" ).change(function() {
  25                         var current = $( "#spinner" ).spinner( "value" );
  26                         Globalize.culture( $(this).val() );
  27                         $( "#spinner" ).spinner( "value", current );
  28                 });
  29         });
  30         </script>
  31 </head>
  32 <body>
  33
  34 <p>
  35         <label for="spinner">Decimal spinner:</label>
  36         <input id="spinner" name="spinner" value="5.06">
  37 </p>
  38 <p>
  39         <label for="culture">Select a culture to use for formatting:</label>
  40         <select id="culture">
  41                 <option value="en-EN" selected="selected">English</option>
  42                 <option value="de-DE">German</option>
  43                 <option value="ja-JP">Japanese</option>
  44         </select>
  45 </p>
  46
  47 <div class="demo-description">
  48 <p>
  49         Example of a decimal spinner. Step is set to 0.01.
  50         <br>The code handling the culture change reads the current spinner value,
  51         then changes the culture, then sets the value again, resulting in an updated
  52         formatting, based on the new culture.
  53 </p>
  54 </div>
  55 </body>
  56 </html>