diff options
Diffstat (limited to 'tests/visual/selectmenu/disabled_empty.html')
-rw-r--r-- | tests/visual/selectmenu/disabled_empty.html | 168 |
1 files changed, 168 insertions, 0 deletions
diff --git a/tests/visual/selectmenu/disabled_empty.html b/tests/visual/selectmenu/disabled_empty.html new file mode 100644 index 000000000..a15b333b1 --- /dev/null +++ b/tests/visual/selectmenu/disabled_empty.html @@ -0,0 +1,168 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Selectmenu - Disabled & empty elements functionality</title> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.8.3.js"></script> + <script src="../../../ui/jquery.ui.core.js"></script> + <script src="../../../ui/jquery.ui.widget.js"></script> + <script src="../../../ui/jquery.ui.position.js"></script> + <script src="../../../ui/jquery.ui.menu.js"></script> + <script src="../../../ui/jquery.ui.selectmenu.js"></script> + <link rel="stylesheet" href="../../../demos/demos.css"> + <script> + $(function() { + /* disabled */ + $('select#disabled1').selectmenu({ + dropdown: false + }); + var withOverflow = $('select#disabled2').selectmenu({ + dropdown: false + }); + withOverflow.selectmenu("menuWidget").addClass("overflow"); + $('select#disabled3').selectmenu(); + var disabled4 = $('select#disabled4').selectmenu(); + + $("#disable_select").toggle( function() { + disabled4.selectmenu("disable"); + }, function() { + disabled4.removeAttr("disabled"); + disabled4.selectmenu("refresh"); + }); + $("#disable_option").toggle( function() { + disabled4.find("option:eq(0)").attr("disabled", "disabled"); + disabled4.selectmenu("refresh"); + }, function() { + disabled4.find("option:eq(0)").removeAttr("disabled"); + disabled4.selectmenu("refresh"); + }); + $("#disable_optgroup").toggle( function() { + disabled4.find("optgroup:eq(0)").attr("disabled", "disabled"); + disabled4.selectmenu("refresh"); + }, function() { + disabled4.find("optgroup:eq(0)").removeAttr("disabled"); + disabled4.selectmenu("refresh"); + }); + + /* empty */ + $('select.empty').selectmenu(); + }); + </script> + <style> + fieldset { border: 0; } + label { display: block; } + select { width: 200px; } + .overflow { height: 200px; } + </style> +</head> +<body> + +<div class="demo"> + +<form action="#"> + <h2>Disabled Tests</h2> + <fieldset> + <label for="disabled1">Select a speed:</label> + <select disabled="disabled" name="disabled1" id="disabled1"> + <option value="Slower">Slower</option> + <option value="Slow">Slow</option> + <option value="Medium" selected="selected">Medium</option> + <option value="Fast">Fast</option> + <option value="Faster">Faster</option> + </select> + <br /> + <br /> + <label for="disabled2">Select a number:</label> + <select name="disabled2" id="disabled2"> + <option value="1">1</option> + <option value="2" selected="selected">2</option> + <option value="3">3</option> + <option disabled="disabled" value="4">4</option> + <option value="5">5</option> + <option value="6">6</option> + <option value="7">7</option> + <option disabled="disabled" value="8">8</option> + <option value="9">9</option> + <option value="10">10</option> + <option disabled="disabled" value="11">11</option> + <option value="12">12</option> + <option value="13">13</option> + <option disabled="disabled" value="14">14</option> + <option disabled="disabled" value="15">15</option> + <option value="16">16</option> + <option value="17">17</option> + <option value="18">18</option> + <option value="19">19</option> + </select> + <br /> + <br /> + <label for="disabled3">Select a file:</label> + <select name="disabled3" id="disabled3"> + <optgroup disabled="disabled" label="Scripts"> + <option value="jquery">jQuery.js</option> + <option value="jqueryui">ui.jQuery.js</option> + </optgroup> + <optgroup label="Other files"> + <option value="somefile">Some unknown file</option> + <option value="someotherfile">Some other file</option> + </optgroup> + </select> + <br /> + <br /> + <label for="disabled4">Select a file:</label> + <select name="disabled4" id="disabled4"> + <optgroup label="Scripts"> + <option value="jquery">jQuery.js</option> + <option value="jqueryui">ui.jQuery.js</option> + </optgroup> + <optgroup label="Other files"> + <option value="somefile">Some unknown file</option> + <option value="someotherfile">Some other file</option> + </optgroup> + </select> + <button id="disable_select">Toggle disable select</button> + <button id="disable_option">Toggle disable option</button> + <button id="disable_optgroup">Toggle disable optgroup</button> + </fieldset> + <br /> + <h2>Disabled Tests</h2> + <fieldset> + <select name="speed1" class="empty"></select> + <br /> + <br /> + <select name="speed2" class="empty"> + <option value=""></option> + </select> + <br /> + <br /> + <select name="number" class="empty"> + <option value="1">1</option> + <option value="2" selected="selected">2</option> + <option value="3">3</option> + <option value="4">4</option> + <option value=""></option> + <option value="6">6</option> + <option value="7">7</option> + <option value=""></option> + <option value="9">9</option> + </select> + <br /> + <br /> + <select name="files" class="empty"> + <optgroup label="Scripts"></optgroup> + <optgroup label="Other files"> + <option value="somefile">Some unknown file</option> + <option value="someotherfile">Some other file</option> + </optgroup> + </select> + </fieldset> +</form> +<br /> + +</div><!-- End demo --> + + + +</body> +</html> |