1
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
5
<title>jQuery Autocomplete Plugin</title>
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>
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">
15
<script type="text/javascript">
16
$().ready(function() {
18
function findValueCallback(event, data, formatted) {
19
$("<li>").html( !data ? "No match!" : "Selected: " + formatted).appendTo("#result");
22
function formatItem(row) {
23
return row[0] + " (<strong>id: " + row[1] + "</strong>)";
25
function formatResult(row) {
26
return row[0].replace(/(<.+?>)/gi, '');
29
$("#suggest1").autocomplete({ data: cities });
30
$("#month").autocomplete({
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()] )
45
$("#suggest13").autocomplete({
49
matchContains: "word",
51
formatItem: function(row, i, max) {
52
return i + "/" + max + ": \"" + row.name + "\" [" + row.to + "]";
54
formatMatch: function(row, i, max) {
55
return row.name + " " + row.to;
57
formatResult: function(row) {
62
$("#suggest3").autocomplete({
69
$("#tags").autocomplete(["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby", "python", "c", "scala", "groovy", "haskell", "pearl"], {
74
multipleSeparator: " ",
81
$("#clear").click(function() {
82
$(":input").unautocomplete();
94
<form autocomplete="off">
96
<label>Single City (local):</label>
97
<input type="text" id="suggest1" />
98
<input type="button" value="Get Value" />
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)
107
<label>E-Mail (local):</label>
108
<input type="text" id="suggest13" />
109
<input type="button" value="Get Value" />
112
<label>Multiple Cities (local):</label>
113
<textarea id='suggest3' cols='40' rows='3'></textarea>
114
<input type="button" value="Get Value" />
117
<label>Tags (local):</label>
118
<input type="text" id='tags' />
119
<input type="button" value="Get Value" />
122
<input type="submit" value="Submit" />
126
<button id="clear">Remove all autocompletes</button>
128
<h3>Result:</h3> <ol id="result"></ol>