|
0
|
1 <!DOCTYPE html>
|
|
|
2 <html lang="en">
|
|
|
3 <head>
|
|
|
4 <meta charset="utf-8">
|
|
|
5 <title>jQuery UI Autocomplete - Default functionality</title>
|
|
|
6 <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
|
|
|
7 <script src="../../jquery-1.5.1.js"></script>
|
|
|
8 <script src="../../ui/jquery.ui.core.js"></script>
|
|
|
9 <script src="../../ui/jquery.ui.widget.js"></script>
|
|
|
10 <script src="../../ui/jquery.ui.position.js"></script>
|
|
|
11 <script src="../../ui/jquery.ui.autocomplete.js"></script>
|
|
|
12 <link rel="stylesheet" href="../demos.css">
|
|
|
13 <script>
|
|
|
14 $(function() {
|
|
|
15 var availableTags = [
|
|
|
16 "ActionScript",
|
|
|
17 "AppleScript",
|
|
|
18 "Asp",
|
|
|
19 "BASIC",
|
|
|
20 "C",
|
|
|
21 "C++",
|
|
|
22 "Clojure",
|
|
|
23 "COBOL",
|
|
|
24 "ColdFusion",
|
|
|
25 "Erlang",
|
|
|
26 "Fortran",
|
|
|
27 "Groovy",
|
|
|
28 "Haskell",
|
|
|
29 "Java",
|
|
|
30 "JavaScript",
|
|
|
31 "Lisp",
|
|
|
32 "Perl",
|
|
|
33 "PHP",
|
|
|
34 "Python",
|
|
|
35 "Ruby",
|
|
|
36 "Scala",
|
|
|
37 "Scheme"
|
|
|
38 ];
|
|
|
39 $( "#tags" ).autocomplete({
|
|
|
40 source: availableTags
|
|
|
41 });
|
|
|
42 });
|
|
|
43 </script>
|
|
|
44 </head>
|
|
|
45 <body>
|
|
|
46
|
|
|
47 <div class="demo">
|
|
|
48
|
|
|
49 <div class="ui-widget">
|
|
|
50 <label for="tags">Tags: </label>
|
|
|
51 <input id="tags" />
|
|
|
52 </div>
|
|
|
53
|
|
|
54 </div><!-- End demo -->
|
|
|
55
|
|
|
56
|
|
|
57
|
|
|
58 <div class="demo-description">
|
|
|
59 <p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are tags for programming languages, give "ja" (for Java or JavaScript) a try.</p>
|
|
|
60 <p>The datasource is a simple JavaScript array, provided to the widget using the source-option.</p>
|
|
|
61 </div><!-- End demo-description -->
|
|
|
62
|
|
|
63 </body>
|
|
|
64 </html>
|
