Html datalist values from array in javascript
I have a simple program which has to take the values from the text file on server and then populate on the datalist as the selection in the input text field.
For this purpose the first step i want to take is that i want to know that how the array of javascript can be used as a datalist options dynamically.
My Code is :
<html>
<script>
var mycars = new Array();
mycars[0]='Herr';
mycars[1]='Frau';
</script>
<input name="anrede" list="anrede" />
<datalist id="anrede">
<option value= mycars[0]></option>
<option value="Frau"></option>
</datalist>
</html>
I want to populate the input text field containing the datalist as suggestion from the array. Also here I havenot take into account the array values. Actually i need not two datalist options but dxnamic depending on the array length
Answer
This is an old question and already sufficiently answered, but I'm going to throw the DOM method in here anyway for anyone that doesn't like to use literal HTML.
<input name="car" list="anrede" />
<datalist id="anrede"></datalist>
<script>
var mycars = ['Herr','Frau'];
var list = document.getElementById('anrede');
mycars.forEach(function(item){
var option = document.createElement('option');
option.value = item;
list.appendChild(option);
});
</script>