jquery-autolist
Version:
Enable autocomplete suggestions for inputs using a JSON-based API as the datasource.
34 lines (31 loc) • 1.4 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>jquery-autolist demo</title>
<meta name="description" content="jquery-autolist plugin usage example">
<meta name="author" content="Dragoş Tihăuan">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="../jquery.autolist.js"></script>
<body>
<h2>jquery-autolist demo</h2>
<p>type at least 3 characters to get autocomplete suggestions</p>
<label>GitHub repository search
<input type="text" list="projects" name="project" value=""
placeholder="type something" autofocus autocomplete="off">
<datalist id="projects"></datalist>
</label>
<p>source, download and more info at <a href="https://github.com/Tihauan/jquery-autolist">Tihauan/jquery-autolist</a></p>
<script>
/* global $ */
$(document).ready(function() {
$("input[name='project']").autolist("https://api.github.com/search/repositories", {
getItems: function (response) { return response.items; },
getName: function (item) { return item.full_name; }
});
});
</script>
</body>
</html>