# Disable search in Choice component **URL:** \ **Category:** Ask for Help\ **Created:** [March 12, 2023, 2:11am UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046 "2023-03-12T02:11:32Z")\ **Posts on this page:** 20\ **Page:** 1
**Author:** ![Dan76](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dan76/32/15696_2.png) [@Dan76](https://community.glideapps.com/u/Dan76)\ **Post date:** [March 12, 2023, 2:11am UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/1 "2023-03-12T02:11:32Z")
Can the search function in a choice component be disabled if the user wishes? I know it’s supposed to be a feature but it forces the keyboard to pop up when using the app on mobile, which blocks virtually all of the items in the list. I’m only using the app in a mobile format, so it’s really annoying having to close the keyboard every time I want to choose an item ---
**Author:** ![Robert\_Petitto](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/robert_petitto/32/25193_2.png) [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)\ **Post date:** [March 12, 2023, 5:20pm UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/2 "2023-03-12T17:20:04Z")
@Johannes_Gerber @tristan ---
**Author:** ![kyleheney](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/kyleheney/32/41173_2.png) [@kyleheney](https://community.glideapps.com/u/kyleheney)\ **Post date:** [March 12, 2023, 9:20pm UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/3 "2023-03-12T21:20:02Z")
I’d like to see this happen too. Although in most cases, I find it very convenient to have the cursor automatically “activated” in a text entry field on websites, etc, in this case, I think it makes sense for someone to have to tap that entry field to be able to start typing and activate their keyboard. Honestly, unless there are more than 20 or so choices, I think the more common behavior is to manually search the list and select the option you want. ---
**Author:** ![Dan76](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dan76/32/15696_2.png) [@Dan76](https://community.glideapps.com/u/Dan76)\ **Post date:** [March 12, 2023, 10:30pm UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/4 "2023-03-12T22:30:03Z")
There are _just_ enough items in my list to trigger the keyboard, even though they would all be visible on screen if the keyboard wasn’t in the way. In terms of user experience, I’d prefer to scroll even if the list was longer as I find the keyboard pop up quite jarring. It also assumes that the user knows what they are looking for, in some cases they might need to see the list before making a selection. ---
**Author:** ![Matt\_Friesen](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/matt_friesen/32/2388_2.png) [@Matt\_Friesen](https://community.glideapps.com/u/Matt_Friesen)\ **Post date:** [October 6, 2023, 1:58am UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/5 "2023-10-06T01:58:40Z")
This would be great! Choice is very difficult to use in my mobile apps. Horrible UI now, as the keyboard blocks all the choices. ---
**Author:** ![Robert\_Petitto](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/robert_petitto/32/25193_2.png) [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)\ **Post date:** [October 6, 2023, 2:04am UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/6 "2023-10-06T02:04:46Z")
Only problem is that currently dropdown choice components are limited to 20 or so items…so without a search, they’d need to overhaul how the dropdown functions. ---
**Author:** ![Matt\_Friesen](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/matt_friesen/32/2388_2.png) [@Matt\_Friesen](https://community.glideapps.com/u/Matt_Friesen)\ **Post date:** [October 6, 2023, 2:10am UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/7 "2023-10-06T02:10:15Z")
i see about 98 items in my choice options. the old app had a search option; You just had to select it to bring up the keyboard (worked great). The problem with the current system, is that the search/keyboard is selected by default. Very annoying on the phone. On the desktop, it works well. ---
**Author:** ![Rien\_Dumore](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/rien_dumore/32/79283_2.png) [@Rien\_Dumore](https://community.glideapps.com/u/Rien_Dumore)\ **Post date:** [February 9, 2024, 9:51am UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/8 "2024-02-09T09:51:21Z")
Maybe it’s possible to block the search pop-up with custom CSS? ---
**Author:** ![Rien\_Dumore](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/rien_dumore/32/79283_2.png) [@Rien\_Dumore](https://community.glideapps.com/u/Rien_Dumore)\ **Post date:** [February 9, 2024, 12:12pm UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/9 "2024-02-09T12:12:12Z")
Couldn’t find a CSS solution for this. However, maybe it’s possible to use JavaScript to temporarily set the text-number input to external to make Glide think there’s an external keyboard so it won’t show the touchscreen pop-up. ---
**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\ **Post date:** [February 10, 2024, 12:07am UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/10 "2024-02-10T00:07:11Z")
> [@Rien\_Dumore](#): > > However, maybe it’s possible to use JavaScript to temporarily set the text-number input to external to make Glide think there’s an external keyboard so it won’t show the touchscreen pop-up. As far as I know, JavaScript in Glide is used only for transforming data as a column, not to interact with front end stuff. ---
**Author:** ![Rien\_Dumore](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/rien_dumore/32/79283_2.png) [@Rien\_Dumore](https://community.glideapps.com/u/Rien_Dumore)\ **Post date:** [June 8, 2024, 3:28pm UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/11 "2024-06-08T15:28:51Z")
I’ve found a 50% solution. You use 2 choice components writing to same column. One visible when column value empty and one with column value not empty. Use a choice component with chips when empty and dropdown when not empty. This way the first time users have to pick, it shows every option instantenously, and it shrinks the list when the user has selected. Only catch that when a users needs to reselect, the problem remains that a keyboard blocks a part of the list. For me this option is great because im using it in a form screen where users 99% of the time pick the right one first. ![RPReplay_Final1717860217-ezgif.com-resize](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/a/4/a4380e0a937148324c5b569dc0b454e4d932f870.gif) ---
**Author:** ![Joe\_Gabriele](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/joe_gabriele/32/57595_2.png) [@Joe\_Gabriele](https://community.glideapps.com/u/Joe_Gabriele)\ **Post date:** [June 8, 2024, 3:33pm UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/12 "2024-06-08T15:33:50Z")
@tuzin.arts posted this in the CSS Library [https://css-library.glide.page/dl/library/s/8836b3/r/ehd2ar4GQcWdJIVeD5gtZw](https://css-library.glide.page/dl/library/s/8836b3/r/ehd2ar4GQcWdJIVeD5gtZw) #root:has(.mychoice) #app-modal-root \> div \> label { display: none; } This code will hide the search from all dropdowns when the component with .mychoice class is present on the screen (including cases when it’s on the “current” screen under an opened “overlay”/“slide in” screen). **To preview the code results in the builder, you need to turn off “Use compiled CSS” and turn on “Preview custom CSS”.** ---
**Author:** ![Rien\_Dumore](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/rien_dumore/32/79283_2.png) [@Rien\_Dumore](https://community.glideapps.com/u/Rien_Dumore)\ **Post date:** [June 8, 2024, 3:43pm UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/13 "2024-06-08T15:43:05Z")
I’ve seen and tried that, but can’t get it to work. Plus this method saves one click for pressing on the dropdown, it is only lesser when reselecting now ---
**Author:** ![Joe\_Gabriele](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/joe_gabriele/32/57595_2.png) [@Joe\_Gabriele](https://community.glideapps.com/u/Joe_Gabriele)\ **Post date:** [June 8, 2024, 4:05pm UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/14 "2024-06-08T16:05:08Z")
Works for me. Just gotta make sure you do the bold. ---
**Author:** ![Rien\_Dumore](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/rien_dumore/32/79283_2.png) [@Rien\_Dumore](https://community.glideapps.com/u/Rien_Dumore)\ **Post date:** [June 8, 2024, 4:42pm UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/15 "2024-06-08T16:42:15Z")
The bold? ---
**Author:** ![Joe\_Gabriele](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/joe_gabriele/32/57595_2.png) [@Joe\_Gabriele](https://community.glideapps.com/u/Joe_Gabriele)\ **Post date:** [June 8, 2024, 4:53pm UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/16 "2024-06-08T16:53:06Z")
> [@Joe\_Gabriele](#): > > To preview the code results in the builder, you need to turn off “Use compiled CSS” and turn on “Preview custom CSS”. Yes what I bolded in my post lol. **To preview the code results in the builder, you need to turn off “Use compiled CSS” and turn on “Preview custom CSS”.** ---
**Author:** ![Dan76](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dan76/32/15696_2.png) [@Dan76](https://community.glideapps.com/u/Dan76)\ **Post date:** [June 8, 2024, 11:29pm UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/17 "2024-06-08T23:29:10Z")
The CSS works for me, which makes a huge improvement to my app. When I first used the code I assumed the bold part was just so we could view the results in the builder, however, if I switch off preview when I finish building, the code doesn’t work in the live app. Keeping preview switched on, even after closing the builder, works in the live app. This is the only CSS code I’ve used that behaves this way. Not a problem though, I’m just happy it works. ---
**Author:** ![Joe\_Gabriele](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/joe_gabriele/32/57595_2.png) [@Joe\_Gabriele](https://community.glideapps.com/u/Joe_Gabriele)\ **Post date:** [June 9, 2024, 3:55am UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/18 "2024-06-09T03:55:30Z")
Yea that part is funky, no idea why, but that’s why i highlighted in bold lol ---
**Author:** ![Himaladin](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/himaladin/32/71023_2.png) [@Himaladin](https://community.glideapps.com/u/Himaladin)\ **Post date:** [June 9, 2024, 4:11am UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/19 "2024-06-09T04:11:44Z")
Turning off the “Use Compiled CSS” (~ “Use default CSS”) button means that your CSS will be applied to your application, and vice versa. This button is very useful and is used when there is a clash in your CSS code. Meanwhile, the “Preview custom CSS” button is only useful in the builder and does not affect your application whether it is on or off. In another thread, I discussed the functionality of this choice component. The best approach is to shorten it with filters or grouping, not with a search feature, unfortunately, Glide doesn’t have this capability yet. The options should be visible instead of requiring the user to guess the available choices. The search feature is only useful for those who already know the options and want to access them quickly. In this situation, I think the optimal approach would be to make the popup window shorter instead of removing the search feature. However, the choice is ultimately up to your needs. ```auto #root:has(.dropdown-choice) #app-modal-root > div > ul { max-height: calc(-120px + 40vh); } ``` ---
**Author:** ![Himaladin](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/himaladin/32/71023_2.png) [@Himaladin](https://community.glideapps.com/u/Himaladin)\ **Post date:** [June 9, 2024, 5:58am UTC](https://community.glideapps.com/t/disable-search-in-choice-component/59046/20 "2024-06-09T05:58:23Z")
Your idea is interesting, but it will become a problem again when there are too many options to choose from. [Next page](https://community.glideapps.com/t/disable-search-in-choice-component/59046.md?page=2)