Autocomplete Without jQuery UI

Jumpa picture Jumpa · Oct 3, 2013 · Viewed 27.9k times · Source

I'm using jQuery in my project and I need to implement autocomplete, but I'd like to avoid including jQuery UI widget, and hopefully use some specific external plugin. Could you please provide some examples/link? I have to query a remote JSON source that returns key-value couples.

Answer

Cheezy Code picture Cheezy Code · Sep 27, 2015

You can use HTML5 'list' attribute in your input textbox and provide it a custom list of values by using datalist.

<!DOCTYPE html>
<html>
<head>
<!--your stuff-->
</head>
<body>
<!--your stuff-->
<input type="text" id="txtAutoComplete" list="languageList"/><!--your input textbox-->
<datalist id="languageList">
<option value="HTML" />
<option value="CSS" />
<option value="JavaScript" />
<option value="SQL" />
<option value="PHP" />
<option value="jQuery" />
<option value="Bootstrap" />
<option value="Angular" />
<option value="ASP.NET" />
<option value="XML" />
</datalist>
</body>
</html>

If you didn't get it, Read more at http://www.cheezycode.com/2015/09/create-auto-complete-dropdown-using.html

There's a video as well for it Auto-Complete Without JQuery