1 files changed, 119 insertions, 0 deletions
diff --git a/tests/visual/selectmenu/events_methods.html b/tests/visual/selectmenu/events_methods.html
new file mode 100644
index 000000000..2829337b4
--- /dev/null
+++ b/tests/visual/selectmenu/events_methods.html
@@ -0,0 +1,119 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="utf-8">
+	<title>jQuery UI Selectmenu - Events & methods 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() {
+		var log = $("#log"),
+			index = 0;
+
+		var mySelectmenu = $('select').selectmenu({
+			open: function(event, ui) {
+				$("<div/>").text( index++ + " Opened").prependTo(log);
+			},
+			close: function(event, ui) {
+				$("<div/>").text( index++ + " Closed").prependTo(log);
+			},
+			focus : function(event, ui) {
+				$("<div/>").text( index++ + " Focused: " + ui.item.label + " #" + ui.item.index ).prependTo(log);
+			},
+			select: function(event, ui) {
+				$("<div/>").text( index++ + " Selected: " + ui.item.label + " #" + ui.item.index ).prependTo(log);
+			},
+			change: function(event, ui) {
+				$("<div/>").text( index++ + " Changed to: " + ui.item.label + " #" + ui.item.index ).prependTo(log);
+			}
+		});
+		$('select').show();
+
+		$("#destroy").click( function() {
+			mySelectmenu.selectmenu("destroy");
+			return false;
+		});
+
+		$("#refresh_add").click( function() {
+			mySelectmenu.append('<option value="fastsound">Faster than sound</option>');
+			mySelectmenu.selectmenu("refresh");
+			return false;
+		});
+
+		$("#refresh_selected").click( function() {
+			mySelectmenu[0].selectedIndex = 0;
+			mySelectmenu.selectmenu("refresh");
+			return false;
+		});
+
+		$("#refresh").click( function() {
+			mySelectmenu.selectmenu("refresh");
+			return false;
+		});
+
+		$("#open").click( function() {
+			mySelectmenu.selectmenu("open");
+			return false;
+		});
+
+		$("#close").click( function() {
+			mySelectmenu.selectmenu("close");
+			return false;
+		});
+	});
+	</script>
+	<style>
+		form { margin: 20px 0 0 0 }
+		fieldset { border: 0; }
+		label { display: block; }
+		select { width: 200px; }
+
+		#log { height: 400px; width: 270px; overflow: auto; }
+		#control { margin-left: 300px; }
+		#control fieldset { border: 0; width: 270px; }
+		#control button { display: block; }
+	</style>
+</head>
+<body>
+
+<div class="demo">
+
+
+<div style="float: left;">
+	Log:
+	<div id="log" class="ui-widget-content"></div>
+</div>
+
+<div id="control">
+	<form action="#">
+		<fieldset>
+			<label for="speed">Select a speed:</label>
+			<select name="speed" id="speed">
+				<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>
+		</fieldset>
+		<button id="destroy">Destroy</button>
+		<button id="refresh_add">Add item</button>
+		<button id="refresh">Refresh</button>
+		<button id="refresh_selected">Change to first item</button>
+		<button id="open">Open</button>
+		<button id="close">Close</button>
+	</form>
+</div>
+
+</div><!-- End demo -->
+
+
+
+</body>
+</html>