demos/tizen-winsets/widgets/radio/radio.html

   1 <!DOCTYPE html>
   2 <html>
   3         <head>
   4                 <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8" >
   5                 <script src="../../tizen-web-ui-fw/latest/js/jquery.min.js"></script>
   6                 <script src="../../configure.js"></script>
   7                 <script src="../../tizen-web-ui-fw/latest/js/tizen-web-ui-fw-libs.min.js"></script>
   8                 <script src="../../tizen-web-ui-fw/latest/js/tizen-web-ui-fw.min.js"
   9                                 data-framework-theme="tizen-white"
  10                                 data-framework-viewport-width="device-width">
  11                 </script>
  12                 <script src="../../main.js"></script>
  13                 <title>Tizen UI - Radio</title>
  14                 <!-- for compatibility test -->
  15                 <meta name="apple-mobile-web-app-capable" content="yes" />
  16                 <meta name="apple-mobile-web-app-status-bar-style" content="black" />
  17                 <link rel="apple-touch-icon" href="../../icon-tizen.png" />
  18         </head>
  19         <body>
  20                 <div id="radio-demo" data-role="page" data-add-back-btn="true">
  21
  22                         <div data-role="header" data-position="fixed">
  23                                 <h1>RADIO</h1>
  24
  25                         </div>
  26
  27                         <div data-role="content">
  28                                 <div class="content-primary">
  29                                         <fieldset data-role="controlgroup">
  30                                                 <legend>Choose a pet:</legend>
  31                                                 <input type="radio" name="radio-choice" id="radio-choice-1" value="choice-1" checked="checked" />
  32                                                 <label for="radio-choice-1">Cat</label>
  33
  34                                                 <input type="radio" name="radio-choice" id="radio-choice-2" value="choice-2"  />
  35                                                 <label for="radio-choice-2">Dog</label>
  36
  37                                                 <input type="radio" name="radio-choice" id="radio-choice-3" value="choice-3"  />
  38                                                 <label for="radio-choice-3">Hamster</label>
  39
  40                                                 <input type="radio" name="radio-choice" id="radio-choice-4" value="choice-4"  />
  41                                                 <label for="radio-choice-4">Lizard</label>
  42                                         </fieldset>
  43                                         <p> Trigged When user clicks a radio button :
  44                                                 <span class="triggered-radio">
  45                                                         <em>(This is updated when user clicks a radio button )</em>
  46                                                 </span>
  47                                         </p>
  48
  49                                         <input type="radio" name="radio-1" id="radio-1" checked="checked" disabled="disabled" />
  50                                         <label for="radio-1">Checked, Disabled</label>
  51                                         <input type="radio" name="radio-2" id="radio-2" disabled="disabled"/>
  52                                         <label for="radio-2">Disabled</label>
  53                                         <input type="radio" name="radio-3" id="radio-3"/>
  54                                         <label for="radio-3">Unchecked</label>
  55
  56                                 </div><!--/content-primary -->
  57                         </div>
  58                         <div data-role="footer">
  59                         </div>
  60                         <script src="radio.js"></script>
  61                 </div> <!-- page -->
  62         </body>
  63 </html>