aboutsummaryrefslogtreecommitdiff
path: root/includes/js/dojox/wire/demos/markup/demo_TopicWiring.html
blob: e091e8ba30faeccbea3f6b2308aabefa8d093ad9 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!--
	This file demonstrates how the dojox.wire code can be used to do declarative
	wiring of events.  Specifically, it shows how you can publish and subscribe 
	to topics.  In this case the setting of a value on one textbox triggers a 
	publish of that value to a topic.  Another invoke is wired to fire when
	values are published to that topic which is then displayed in another 
	textbox.
-->
<html>
<head>
	<title>Sample Topic Wiring</title>
	<style type="text/css">

		@import "../../../../dijit/themes/tundra/tundra.css";
		@import "../../../../dojo/resources/dojo.css";
		@import "../../../../dijit/tests/css/dijitTests.css";
		@import "../TableContainer.css";

		.splitView {
			width: 90%;
			height: 90%;
			border: 1px solid #bfbfbf;
			border-collapse: separate;
		}
	</style>

	<script type="text/javascript" src="../../../../dojo/dojo.js" djConfig="isDebug: true, parseOnLoad: true"></script>
	<script type="text/javascript">
		dojo.require("dojo.parser");
		dojo.require("dojox.wire");
		dojo.require("dojox.wire.ml.Invocation");
		dojo.require("dojox.wire.ml.DataStore");
		dojo.require("dojox.wire.ml.Transfer");
		dojo.require("dojox.wire.ml.Data");

		dojo.require("dijit.form.TextBox");
	</script>
</head>

<body class="tundra">

	<!-- Layout -->
	<font size="3"><b>Demo of Topic Wiring</b></font><br/><br/>
	This demo shows how you can wire events to publish to a topic as well as recieve topic events
	<br/>
	<br/>
	<table>
		<tr>
			<td>
				<div dojoType="dijit.form.TextBox" jsId="inputField" value="" size="50"></div>
			</td>
		</tr>
		<tr>
			<td>
				<div dojoType="dijit.form.TextBox" jsId="targetField1" value="" disabled="true" size="50"></div>
			</td>
		</tr>
	</table>


	<!-------------------------------- Using dojox.wire, declaratively wire up the widgets. --------------------------->
	
	<!-- 
		Whenever a key is entered into the textbox, publish the value of it to a topic.
	-->
	<div dojoType="dojox.wire.ml.Action"
		id="action1"
		trigger="inputField"
		triggerEvent="onkeyup">
		<div dojoType="dojox.wire.ml.Invocation" topic="sampleTopic"    parameters="inputField.value"></div>
	</div>    

	<!-- 
		Whenever a value is published to a topic, set it as the value of the textbox by calling the setValue function.
	-->
	<div dojoType="dojox.wire.ml.Invocation" triggerTopic="sampleTopic" object="targetField1"    method="setValue" parameters="arguments[0]"></div>
</body>
</html>