Datalist behaviour in ios


#1

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 >&nbsp;
                                <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.

  1. 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?
  2. 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?

#2

Looks like datalist is still not supported in ios.