Demo

Here are a few examples of using the suggest box. Have a look at the testData.js file to see what kind of data I am passing in to the plugin. There is also an example of requesting JSON data from a URL and retrieving results from a custom function on each search which is handy. There are more options than those being used in these few examples so see the options break down at the bottom of this page. The drop downs can be styled however you wish, the javascript will only set their position underneath the text box.

Example 1


$('input#suggestBox').jsonSuggest(testData.countryCodes, {onSelect:callback});

Example 2


$('input#suggestBox').jsonSuggest(testData.webSites, {onSelect:callback});

Example 3


$.getJSON("http://tomcoote.co.uk/JavaScript/JSONSuggestBox/testData/countryCodes.txt",
	function(data){
		$('input#suggestBox3').jsonSuggest(data, {maxResults:20});
	}
);

Example 4


$('input#suggestBox4').jsonSuggest(
	function(text, wildCard, caseSensitive, notCharacter) {
		// From here you can put your own logic in to say what results show.
		// For now I'm just going to return some dummy data.
		
		return [
			{text:'View'},
			{text:'the'},
			{text:'source'},
			{text:'for'},
			{text:'this'},
			{text:'one'}
		];
	}, {ajaxResults:true});

Options


Have fun