'How Do I Add Options To Auto Complete From Variable via json materialize css
So Basically what im trying to do is have my for each function for firebase database append a new line to a json variable, and it does it successfully but when i try to init the auto complete box with that data, it doesnt work, its just a normal typing box, i have logged my json variable, and it comes out correct, but it doesnt init properly Heres All My Code:
Index.html
<div class="input-field col s12">
<i class="material-icons prefix">person</i>
<input type="text" id="autocomplete-input" class="autocomplete">
<label for="autocomplete-input">Autocomplete Test</label>
</div>
index.js
var autocompletejson
const database = firebase.database()
database.ref('FLSocial/Accounts/')
.once('value', function (snapshot) { // <-- consider Promise API instead
const sortedChildren = [];
snapshot.forEach(childSnapshot => { sortedChildren.unshift(childSnapshot) }); // reverses the order
sortedChildren.forEach(childSnapshot => {
const childKey = childSnapshot.key;
const childData = childSnapshot.val();
/* rest of the code */
autocompletejson += `
"${childKey}": null,`;
})
setTimeout(test_autofill, 3000)
//3 Seconds Later it runs the function grabbing the global variable and trying to init the auto complete with the data
});
function test_autofill() {
console.log(autocompletejson)
$('input.autocomplete').autocomplete({
data: {autocompletejson},
});
}
Example They Gave On The MaterializeCSS website:
$(document).ready(function(){
$('input.autocomplete').autocomplete({
data: {
"Apple": null,
"Microsoft": null,
"Google": 'https://placehold.it/250x250'
},
});
});
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
