CODEWITHSUNDEEP
javascriptiosangularjscordovaionic-framework
dease
dease

Reputation: 3076

Ionic - hide iOS selection wheel (select options) after selection

I am trying to hide Ionic (iOS) "selection wheel" which is displayed after user want to select one of the select tag options.

I know that can be achieved by showing keyboard accessory bar and "done" button but that button text is hardcoded (and as far as I know we cannot translate it to other languages). So this is not an option.

I am also not available to use "change" event for the select, because its not triggered until selection wheel is being hidden.

Is there any way to:

  1. Change "done" button text in accessory bar?
  2. Detect changed value in selection wheel on iOS and hide it

programatically?

Thank you

Upvotes: 9

Views: 1053

Answers (2)

Gandhi
Gandhi

Reputation: 11935

I believe cordova plugin picker should help you out in this case.

This plugin allows for more dynamic access to the picker widget normally displayed when a <select> is tapped, in particular on ios. This plugin allows direct control of the PickerView and what options are shown. This enables lazy-loading display options, dynamically changing options and paging large data sets.

Since it gives more control of the picker view, it should help you out. Please check.

Upvotes: 2

jcesarmobile
jcesarmobile

Reputation: 53361

To "translate" the "Done" button you can follow the approach on Cordova 6.0.0 iOS localization with [email protected] and Xcode 7.2.1

Change the CFBundleDevelopmentRegion

<key>CFBundleDevelopmentRegion</key>
<string>es</string>

Or add the localizations you want to support (will work if the device has set any of that localizations)

<key>CFBundleLocalizations</key>
<array>
    <string>es</string>
    <string>en</string>
    <string>fr</string>
</array>

To make this changes you should use a "dumb" plugin that just writes on the info.plist using the config-file tag, or use a hook

You can also use a native component to show the list of options instead of using the select tag

There are probably a few plugins available, you can try this one, it doesn't have a method to hide the wheel, but it could be implemented, try opening an issue on the plugin github repo.

Upvotes: 3

Related Questions