I am trying to build an ios version of my app. In android, I have been using the datalist tag to perform free-format text input with a list of possible selection. It works fine in android but somehow it does not work in ios. Here’s the html code for my datalist:
<input type="text"
name="prodList"
id= "prodList"
maxlength = "50"
ng-model-options="{debounce: 500}"
placeholder = "Things to Buy"
ng-model="listData.header.newProduct"
list="productlist">
<datalist id="productlist">
<select >
<option ng-repeat="productname in allproducts" value="{{productname.productName}}">{{productname.productName}}</option>
</select>
</datalist>
I have found a couple of differences on how android and ios displays this field.
- In android, focusing on the input field brings out a list of the options while in ios, the options are listed after the input field and shows the first option. Is there a way to make the behaviour of ios mimic that of android?
- In android, when I start typing text in the input, the option changes to a subset of options that contains the text I type in. In ios, the options remain the same (showing all options) even when I type values in the input. Is this normal behaviour?