<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>jQuery Autocomplete Plugin</title>
<script type="text/javascript" src="jquery-1.1.2.pack.js"></script>
<script type='text/javascript' src='jquery.bgiframe.min.js'></script>
<script type='text/javascript' src='dimensions.js'></script>
<script type='text/javascript' src='jquery.autocomplete.js'></script>
<script type='text/javascript' src='localdata.js'></script>
<link rel="stylesheet" type="text/css" href="main.css" />
<link rel="stylesheet" type="text/css" href="jquery.autocomplete.css" />
<script type="text/javascript">
$().ready(function() {
function findValueCallback(event, data, formatted) {
$("<li>").text( !data ? "No match!" : "Selected: " + formatted).appendTo("#result");
}
function formatItem(row) {
//var row = row.split("|");
return row[0] + " (id: " + row[1] + ")";
}
function formatResult(row) {
return row[0];
}
$("#suggest1").autocomplete('search.php', {
delay: 150,
width: 360,
multiple: false,
matchContains: true,
formatItem: formatItem,
formatResult: formatResult,
extraParams: {
foo: "bar"
}
});
$("#suggest1").result(function(event, data, formatted) {
window.location="/" + data[1];
});
});
</script>
</head>
<body>
<div id="content"> <h3>This is based on Dylan's initial plugin and Dan's and Anjesh' mods.</h3>
<form>
<p>
<label>Search myownspace (remote):</label>
<input id='suggest1' size="50">
<input type="button" value="Go">
</p>
<p>
<label>Hidden input</label>
<input/>
</p>
</form>
<h3>Result:</h3> <ol id="result"></ol>
</div>
</body>
</html>