jQuery facebook autocomplete live demo
Following are the code snippet example for Autocomplete (similar the facebook autocomplete).
Code Example:
<![CDATA[<link charset="utf-8" href="//www.emposha.com/demo/fcbkcomplete_2/style.css" media="screen" rel="stylesheet" type="text/css"></link>
<script charset="utf-8" src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.min.js" type="text/javascript"></script>
<script charset="utf-8" src="//www.emposha.com/demo/fcbkcomplete_2/jquery.fcbkcomplete.js" type="text/javascript"></script>
<h1>
JQuery Autocomplete similar to facebook</h1>
<div id="text">
</div>
<form accept-charset="utf-8" action="submit.php" method="POST">
<select id="select3" name="select3">
<option class="selected" value="sleep">sleep</option>
<option value="sport">sport</option>
<option value="freestyle">freestyle</option>
</select>
<br />
<input type="submit" value="Send" />
</form>
<script type="text/javascript">
/** json_url data **/
var jsonData=[{"key": "hello world", "value": "hello world"}, {"key": "movies", "value": "movies"}, {"key": "ski", "value": "ski"}, {"key": "snowbord", "value": "snowbord"}, {"key": "computer", "value": "computer"}, {"key": "apple", "value": "apple"}, {"key": "pc", "value": "pc"}, {"key": "ipod", "value": "ipod"}, {"key": "ipad", "value": "ipad"}, {"key": "iphone", "value": "iphone"}, {"key": "iphon4", "value": "iphone4"}, {"key": "iphone5", "value": "iphone5"}, {"key": "samsung", "value": "samsung"}, {"key": "blackberry", "value": "blackberry"}]
/** json_url data **/
$(document).ready(function(){
$("#select3").fcbkcomplete({
json_url: "http://www.emposha.com/demo/fcbkcomplete_2/data.txt",// This must be in your server
addontab: true,
maxitems: 2,
height: 2,
cache: true
});
});
</script>
<div id="testme">
</div>
]]>
