tests/manual/valuechange-multiple.html

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
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove<!DOCTYPE html>
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove<html>
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove    <head>
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove        <title>ValueChange Multiple Subscriptions</title>
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove    </head>
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove    <body>
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove        <h1>ValueChange Multiple Subscriptions</h1>
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove        <label for="my-input">Type Here</label>
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove        <input id="my-input" type="text">
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove        <button id="detach">Detach First Subscription</button>
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove        <button id="detach2">Detach Second Subscription</button>
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove        <script src="/build/yui/yui.js"></script>
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove        <script>
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove            YUI({
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove                combine : false,
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove                filter  : 'debug'
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove            }).use('node', 'event-valuechange', function(Y){
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove                var myInput = Y.one('#my-input'), sub, sub2;
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove                sub = myInput.on('valueChange', function(e){
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove                    Y.log('sub 1: ' + e.newVal);
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove                });
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove                sub2 = myInput.on('valueChange', function(e){
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove                    Y.log('sub 2: ' + e.newVal);
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove                });
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove                Y.one('#detach').once('click', function (e) {
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove                    sub.detach();
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove                });
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove                Y.one('#detach2').once('click', function (e) {
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove                    sub2.detach();
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove                });
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove            });
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove        </script>
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove    </body>
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove
8c477f25e31548f026be122d9f91c457b65279b5Ryan Grove</html>