Skip to content

Instantly share code, notes, and snippets.

Created October 20, 2016 03:27
Show Gist options
  • Save anonymous/ffc260c5dd8a7840813916781c8c1474 to your computer and use it in GitHub Desktop.
Save anonymous/ffc260c5dd8a7840813916781c8c1474 to your computer and use it in GitHub Desktop.
Example of dinamic populated datalist [Example of dinamic populated datalist] // source https://jsbin.com/zenayababi
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="[Example of dinamic populated datalist]">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Example of dinamic populated datalist</title>
</head>
<body>
<datalist id="users"></datalist>
<input list="users" name="myUsers" />
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<script id="jsbin-javascript">
$(document).ready(function(){
var appendItemInDataList = function(value, text){
$('#users').append($('<option>', {
value: value,
text : text
}));
}
var root = 'https://jsonplaceholder.typicode.com';
$.get(root + '/users', function( data ) {
data.map(function(item){
appendItemInDataList(item.id, item.name);
});
});
});
</script>
<script id="jsbin-source-javascript" type="text/javascript">$(document).ready(function(){
var appendItemInDataList = function(value, text){
$('#users').append($('<option>', {
value: value,
text : text
}));
}
var root = 'https://jsonplaceholder.typicode.com';
$.get(root + '/users', function( data ) {
data.map(function(item){
appendItemInDataList(item.id, item.name);
});
});
});</script></body>
</html>
$(document).ready(function(){
var appendItemInDataList = function(value, text){
$('#users').append($('<option>', {
value: value,
text : text
}));
}
var root = 'https://jsonplaceholder.typicode.com';
$.get(root + '/users', function( data ) {
data.map(function(item){
appendItemInDataList(item.id, item.name);
});
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment