<select> tag is not working on some android devices in ionic

So, select box is not working on android device(e.g. galaxy s6). I am using an ionic framework.. when i click on select box nothing appears, but if i click it at the border(it is very hard) options shows. as i know it is a ionic's bug.. any solutions? thank you in advance this is a select box image and this is options menu

        <div class="list list-language">
            <label class="item item-input item-icon-left item-select">
                <div class="input-label">
                    <i class="flag {{ $root.locale }}"></i>
                    <i class="icon icon-arrow-right-alt"></i>
                </div>
                <select ng-model="$root.locale" ng-change="vm.changeLocale($root.locale)" tabindex="-1">
                    <option ng-selected="$root.locale == 'en'" value="en">{{ 'ENGLISH' | translate }}</option>
                    <option ng-selected="$root.locale == 'ka'" value="ka">{{ 'GEORGIAN' | translate }}</option>
                    <option ng-selected="$root.locale == 'ru'" value="ru">{{ 'RUSSIAN' | translate }}</option>
                </select>
            </label>
        </div>

Upvotes: 5

Views: 1826

Answers (2)

Scott Ferguson
Scott Ferguson

Reputation: 419

Try applying the data-tap-disabled attribute to the select tag. Here's some info on it. It basically disables the Ionic tap behavior that is causing the issue.

Upvotes: 6

Alex Ryltsov
Alex Ryltsov

Reputation: 2993

I think the problem could be related to your markup where you have label element wrapping div and select. Can you try to change label to smth else, for example to div. Or try to change div to span..

HTML does not allow a <label> to contain a <div>.

Upvotes: 0

Related Questions