|
7
|
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.10.2.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.menu.js"></script>
|
|
|
12 <script src="../../ui/jquery.ui.autocomplete.js"></script>
|
|
|
13 <link rel="stylesheet" href="../demos.css">
|
|
|
14 <script>
|
|
|
15 $(function() {
|
|
|
16 var availableTags = [
|
|
|
17 "ActionScript",
|
|
|
18 "AppleScript",
|
|
|
19 "Asp",
|
|
|
20 "BASIC",
|
|
|
21 "C",
|
|
|
22 "C++",
|
|
|
23 "Clojure",
|
|
|
24 "COBOL",
|
|
|
25 "ColdFusion",
|
|
|
26 "Erlang",
|
|
|
27 "Fortran",
|
|
|
28 "Groovy",
|
|
|
29 "Haskell",
|
|
|
30 "Java",
|
|
|
31 "JavaScript",
|
|
|
32 "Lisp",
|
|
|
33 "Perl",
|
|
|
34 "PHP",
|
|
|
35 "Python",
|
|
|
36 "Ruby",
|
|
|
37 "Scala",
|
|
|
38 "Scheme"
|
|
|
39 ];
|
|
|
40 $( "#tags" ).autocomplete({
|
|
|
41 source: availableTags
|
|
|
42 });
|
|
|
43 });
|
|
|
44 </script>
|
|
|
45 </head>
|
|
|
46 <body>
|
|
|
47
|
|
|
48 <div class="ui-widget">
|
|
|
49 <label for="tags">Tags: </label>
|
|
|
50 <input id="tags">
|
|
|
51 </div>
|
|
|
52
|
|
|
53 <div class="demo-description">
|
|
|
54 <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>
|
|
|
55 <p>The datasource is a simple JavaScript array, provided to the widget using the source-option.</p>
|
|
|
56 </div>
|
|
|
57 </body>
|
|
|
58 </html>
|
