~jstys-z/helioviewer.org/client5

« back to all changes in this revision

Viewing changes to lib/jquery/jquery.ui-1.6rc2/tests/visual/autocomplete/index.html

  • Committer: V. Keith Hughitt
  • Date: 2009-03-26 19:20:57 UTC
  • Revision ID: hughitt1@kore-20090326192057-u0x8rf8sf5lmmnwh
nightly build 03-26-2009: Using alpha-channel JPEG 2000 dataset

Show diffs side-by-side

added added

removed removed

Lines of Context:
1
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
2
 
<html>
3
 
<head>
4
 
 
5
 
<title>jQuery Autocomplete Plugin</title>
6
 
 
7
 
<script type="text/javascript" src="../../../jquery-1.2.6.js"></script>
8
 
<script type="text/javascript" src="../../../ui/ui.core.js"></script>
9
 
<script type="text/javascript" src="../../../ui/ui.autocomplete.js"></script>
10
 
 
11
 
<script type='text/javascript' src='localdata.js'></script>
12
 
<link rel="stylesheet" type="text/css" href="main.css" />
13
 
<link rel="stylesheet" href="../../../themes/default/ui.all.css" type="text/css" media="screen" title="no title" charset="utf-8">
14
 
        
15
 
<script type="text/javascript">
16
 
$().ready(function() {
17
 
 
18
 
        function findValueCallback(event, data, formatted) {
19
 
                $("<li>").html( !data ? "No match!" : "Selected: " + formatted).appendTo("#result");
20
 
        }
21
 
        
22
 
        function formatItem(row) {
23
 
                return row[0] + " (<strong>id: " + row[1] + "</strong>)";
24
 
        }
25
 
        function formatResult(row) {
26
 
                return row[0].replace(/(<.+?>)/gi, '');
27
 
        }
28
 
        
29
 
        $("#suggest1").autocomplete({ data: cities });
30
 
        $("#month").autocomplete({
31
 
                data: months,
32
 
                minChars: 0,
33
 
                max: 12,
34
 
                autoFill: true,
35
 
                mustMatch: true,
36
 
                matchContains: false,
37
 
                scrollHeight: 220,
38
 
                formatItem: function(data, i, total) {
39
 
                        // don't show the current month in the list of values (for whatever reason)
40
 
                        if ( data[0] == months[new Date().getMonth()] ) 
41
 
                                return false;
42
 
                        return data[0];
43
 
                }
44
 
        });
45
 
        $("#suggest13").autocomplete({
46
 
                data: emails,
47
 
                minChars: 0,
48
 
                width: 310,
49
 
                matchContains: "word",
50
 
                autoFill: false,
51
 
                formatItem: function(row, i, max) {
52
 
                        return i + "/" + max + ": \"" + row.name + "\" [" + row.to + "]";
53
 
                },
54
 
                formatMatch: function(row, i, max) {
55
 
                        return row.name + " " + row.to;
56
 
                },
57
 
                formatResult: function(row) {
58
 
                        return row.to;
59
 
                }
60
 
        });
61
 
 
62
 
        $("#suggest3").autocomplete({
63
 
                data: cities,
64
 
                multiple: true,
65
 
                mustMatch: true,
66
 
                autoFill: true
67
 
        });
68
 
 
69
 
        $("#tags").autocomplete(["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby", "python", "c", "scala", "groovy", "haskell", "pearl"], {
70
 
                width: 320,
71
 
                max: 4,
72
 
                highlight: false,
73
 
                multiple: true,
74
 
                multipleSeparator: " ",
75
 
                scroll: true,
76
 
                scrollHeight: 300
77
 
        });
78
 
        
79
 
 
80
 
        
81
 
        $("#clear").click(function() {
82
 
                $(":input").unautocomplete();
83
 
        });
84
 
});
85
 
 
86
 
</script>
87
 
        
88
 
</head>
89
 
 
90
 
<body>
91
 
 
92
 
<div id="content">
93
 
        
94
 
        <form autocomplete="off">
95
 
                <p>
96
 
                        <label>Single City (local):</label>
97
 
                        <input type="text" id="suggest1" />
98
 
                        <input type="button" value="Get Value" />
99
 
                </p>
100
 
                <p>
101
 
                        <label>Month (local):</label>
102
 
                        <input type="text" id="month" />
103
 
                        <input type="button" value="Get Value" />
104
 
                        (Current month is excluded from list)
105
 
                </p>
106
 
                <p>
107
 
                        <label>E-Mail (local):</label>
108
 
                        <input type="text" id="suggest13" />
109
 
                        <input type="button" value="Get Value" />
110
 
                </p>
111
 
                <p>
112
 
                        <label>Multiple Cities (local):</label>
113
 
                        <textarea id='suggest3' cols='40' rows='3'></textarea>
114
 
                        <input type="button" value="Get Value" />
115
 
                </p>
116
 
                <p>
117
 
                        <label>Tags (local):</label>
118
 
                        <input type="text" id='tags' />
119
 
                        <input type="button" value="Get Value" />
120
 
                </p>
121
 
                
122
 
                <input type="submit" value="Submit" />
123
 
        </form>
124
 
 
125
 
                
126
 
        <button id="clear">Remove all autocompletes</button>
127
 
        
128
 
        <h3>Result:</h3> <ol id="result"></ol>
129
 
 
130
 
</div>
131
 
</body>
132
 
</html>