PerfectEquation
/
GZ


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
							<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
		"http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<title>Dojo Spinner Widget Test</title>

		<style type="text/css">
			@import "../../../dojo/resources/dojo.css";
			@import "../../../dijit/themes/tundra/tundra.css";
			@import "../../../dijit/themes/dijit.css";
			@import "../../../dijit/tests/css/dijitTests.css";
		</style>

		<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug:true, parseOnLoad: true"></script>

		<script type="text/javascript">
			dojo.require("dojox.widget.TimeSpinner");
			dojo.require("dojo.parser"); // scan page for widgets

			function displayData() {
				var spinner = dijit.byId("timeSpinner");

				//accessing the widget property directly
				console.log("TimeSpinner Value (raw, unserialized): ", spinner.getValue());

				//accessing the widget from the form elements
				var theForm = dojo.byId("form1");
				var s = "";
				for (var i=0; i<theForm.elements.length;i++){
					var elem = theForm.elements[i];
					if (!elem.name || elem.name =="button") { continue ; }
					s+=elem.name + ": " + elem.value + "\n";
				}
				console.log(s);
				
                	}

		</script>
		<style type="text/css">
			#integerspinner2 .dojoSpinnerUpArrow {
				border-bottom-color: blue;
			}
			#integerspinner2 .dojoSpinnerDownArrow {
				border-top-color: red;
			}
			#integerspinner2 .dojoSpinnerButton {
				background-color: yellow;
			}
			#integerspinner2 .dojoSpinnerButtonPushed {
				background-color: gray;
			}
			#integerspinner2 .dojoSpinnerButtonPushed .dojoSpinnerDownArrow {
				border-top-color: blue;
			}
			#integerspinner2 .dojoSpinnerButtonPushed .dojoSpinnerUpArrow {
				border-bottom-color: red;
			}

			.dojoInputFieldValidationNormal#integerspinner2 {
				color:blue;
				background-color:pink;
			}
		</style>
	</head>

	<body class="tundra">
	<h1 class="testTitle">Dojox TimeSpinner Test</h1>
		Try typing values, and use the up/down arrow keys and/or the arrow push
		buttons to spin
		<br>
	<form id="form1" action="" name="example" method="post">
		<h1>time spinner</h1>
		<br>
		<input id="timeSpinner" dojoType="dojox.widget.TimeSpinner"
			onChange="console.debug('onChange fired for widget id = ' + this.id + ' with value = ' + arguments[0]);"
			value="12:30 PM"
			name="timeSpinner"
			hours="12"
			id="timeSpinner" />
	</form>

	<div>
		<button name="button" onclick="displayData(); return false;">view data</button>
	</div>

	</body>
</html>