diff options
| author | Alexander Schmitz <arschmitz@gmail.com> | 2014-08-28 15:16:51 -0400 |
|---|---|---|
| committer | Alexander Schmitz <arschmitz@gmail.com> | 2015-10-07 10:57:59 -0400 |
| commit | 25d0c857188c19347c869f803530289762199f92 (patch) | |
| tree | 768afcbc456f878fb35e96546f468f9ffaa46b80 /demos/checkboxradio/default.html | |
| parent | 02033262ee0fb1d9f33c361b3c2ddfa168604854 (diff) | |
| download | jquery-ui-25d0c857188c19347c869f803530289762199f92.tar.gz jquery-ui-25d0c857188c19347c869f803530289762199f92.zip | |
Checkboxradio: Initial commit of new widget
Diffstat (limited to 'demos/checkboxradio/default.html')
| -rw-r--r-- | demos/checkboxradio/default.html | 70 |
1 files changed, 70 insertions, 0 deletions
diff --git a/demos/checkboxradio/default.html b/demos/checkboxradio/default.html new file mode 100644 index 000000000..c8f4c5566 --- /dev/null +++ b/demos/checkboxradio/default.html @@ -0,0 +1,70 @@ +<!doctype html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Checkboxradio - Default functionality</title> + <link rel="stylesheet" href="../../themes/base/all.css"> + <script src="../../external/jquery/jquery.js"></script> + <script src="../../ui/core.js"></script> + <script src="../../ui/widget.js"></script> + <script src="../../ui/checkboxradio.js"></script> + <link rel="stylesheet" href="../demos.css"> + <script> + $(function() { + $( "input" ).checkboxradio({ + label: "foo" + }); + }); + </script> +</head> +<body> +<div class="widget"> + <h1>Checkbox and radio button widgets</h1> + + <h2>Radio Group</h2> + <fieldset> + <legend>Select a Location: </legend> + <label for="radio-1">New York</label> + <input type="radio" name="radio-1" id="radio-1"> + <label for="radio-2">Paris</label> + <input type="radio" name="radio-1" id="radio-2"> + <label for="radio-3">London</label> + <input type="radio" name="radio-1" id="radio-3"> + </fieldset> + + <h2>Checkbox</h2> + <fieldset> + <legend>Hotel Ratings: </legend> + <label for="checkbox-1">2 Star</label> + <input type="checkbox" name="checkbox-1" id="checkbox-1"> + <label for="checkbox-2">3 Star</label> + <input type="checkbox" name="checkbox-2" id="checkbox-2"> + <label for="checkbox-3">4 Star</label> + <input type="checkbox" name="checkbox-3" id="checkbox-3"> + <label for="checkbox-4">5 Star</label> + <input type="checkbox" name="checkbox-4" id="checkbox-4"> + </fieldset> + + <h2>Checkbox nested in label</h2> + <fieldset> + <legend>Bed Type: </legend> + <label for="checkbox-nested-1">2 Double + <input type="checkbox" name="checkbox-nested-1" id="checkbox-nested-1"> + </label> + <label for="checkbox-nested-2">2 Queen + <input type="checkbox" name="checkbox-nested-2" id="checkbox-nested-2"> + </label> + <label for="checkbox-nested-3">1 Queen + <input type="checkbox" name="checkbox-nested-3" id="checkbox-nested-3"> + </label> + <label for="checkbox-nested-4">1 King + <input type="checkbox" name="checkbox-nested-4" id="checkbox-nested-4"> + </label> + </fieldset> +</div> + +<div class="demo-description"> + <p>Examples of the markup that can be used with checkboxes and radio buttons.</p> +</div> +</body> +</html> |