1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68
|
<html>
<head>
<title>Ajax auto-suggest / auto-complete | BrandSpankingNew</title>
<script type="text/javascript" src="javascript/bsn.AutoSuggest_c_2.0.js"></script>
<link rel="stylesheet" href="css/autosuggest_inquisitor.css" type="text/css" media="screen" charset="utf-8" />
<style type="text/css">
#wrapper {
width: 500px;
margin: 10px auto;
text-align: left;
}
#content {
font-size: 1.2em;
line-height: 1.8em;
}
#content h1 {
font-size: 1.6em;
border-bottom: 1px solid #ccc;
padding: 5px 0 5px 0;
}
#content h2 {
font-size: 1.2em;
margin-top: 3em;
}
label
{
font-weight: bold;
}
</style>
</head>
<body>
<div id="content">
<h1>Autosuggest / Autocomplete with Ajax <small>v. 2.0</small></h1>
<form method="get" action="">
<small style="float:right">Hidden ID Field: <input type="text" id="testid" value="" style="font-size: 10px; width: 20px;" disabled="disabled" /></small>
<label for="testinput">Person (try 'James', 'Scott', 'Pratt' etc)</label>
<input style="width: 200px" type="text" id="testinput" value="" />
<input type="submit" value="submit" />
</form>
</div>
<script type="text/javascript">
var options = {
script:"test.php?json=true&",
varname:"input",
json:true,
callback: function (obj) { document.getElementById('testid').value = obj.id; }
};
var as_json = new AutoSuggest('testinput', options);
var options_xml = {
script:"test.php?",
varname:"input"
};
var as_xml = new AutoSuggest('testinput_xml', options_xml);
</script>
</body>
</html> |
Partager