Wednesday, February 24, 2016

Get value when selected an item from datalist

The datalist element and the list attribute are the two new HTML features that bind up the autocomplete functionality.

I have used above features to implement autocomplete functionality in my sample.

My requirement is to select a cityName from the datalist and want to get cityId from cityList

 <input list="fromCityList" required type="text" name="fromCity" placeholder="City" ng-model="Trip.from.city" ng-change="Trip.from.id = (cityList|filter:{name:Trip.from.city})[0].id">
                                                <datalist id="fromCityList" >
                                                    <select>
                                                        <option ng-repeat="city in cityList | filter : {name : Trip.from.city}"
                                                                value="{{city.name}}" ></option>
                                                    </select>
                                                </datalist> 


I have ued the built-in filter to retrieve the correct cityId value for the cityName.


No comments:

Post a Comment