I have made a PowerApp thats connected to a SharePoint list. My problem arises in the form of the various Choice fields that I've set up are then converted into Dropdown datacards in my PowerApp. Some of my answer choices are quite lnog and end up getting cut off. An example of the problem:
Is there anyway to change the settings of the dropdown so that the solutions are expanded below rather than just permanetly cut off? I realize that you are able to scroll when the user selects an answer choice, but I want to to have the user be able to view all answers choices prior to choosing one. Also, I'm having the same problem in my Labels of the questions. Can anybody help me expand the cut off dropdown choices and the question labels so that the user can properly view them? Thanks in advance.
The default dropdown control doesn't have a 'wrap' property that I'm aware of.
You could set the hovertip to the value of the selected item, but then the user would have to first select something, then hover to see what it is - and if they're using a touch screen hovering becomes something of an interesting capability.
You can however build your own 'dropdown' control, which is something I do often, especially for auto-complete dropdowns without resorting to the combobox.
Disclaimer: this might be overkill and way too complicated for some - for me it's just fun! 🙂
Also, before you try this longwinded approach, be aware that the dropdown will form part of the datacard - it won't "float" over other cards.
if you're still keen to try, you may want to create a blank app to practice, or duplicate the current screen and practice on your duplicate before doing it on your original screen. Here goes;
In your DataCard for the choice column in your Edit form, make a note of your DataCardValue dropdown control name, (I'll just call it DataCardValueN for now - wherever you see DataCardValueX in my code, just replace it with whatever your actual control name is). You can edit the name and copy it with Ctrl+C as well, just to make things easier.
Unlock the Choice Card and remove/delete the choice dropdown control in it. (Don't delete the card, just the dropdown control inside).
Resize your card to give you some space to work - don't worry about the size or the invalid name errors that pop up, we'll sort that out later.
With the Card selected (very important :)), insert the following;
The key to your original question and post is the list box. It wraps long values.
If it didn't, you could still achieve the same result with a Gallery formatted to look like a list, selection boxes and all, but that's a bit more work - for now let's work with the listbox 🙂
Again, don't worry about the height of your DataCard because of the listbox, we'll sort that out in a bit.
Before we set up the ListBox, and just to reduce the errors popping up while we're building;
Select the V and the rectangle icons, set their OnSelect property as follows;
Toggles a variable we'll use for the list visibility between true and false.
Now let's set the listbox up;
Select the ListBox control and set the following properties;
Populates the listbox with your choices from the SharePoint column
If(!IsEmpty(ThisItem.choiceColumn.Value), ThisItem.choiceColumn.Value, "")
In case some of your choice column data doesn't current have a choice selected, this makes sets the currently selected value of the ListBox (and therefore the TextLabel as well, see below) to an empty string ""
We want it to behave like a dropdown, so only one selection at a time.
Our visibility toggle.
Back to your Text Label DataCardValueN, set;
If(IsEmpty(ListBox1.SelectedItems), "", ListBox1.Selected.Value)
Again, just to set it blank if there's currently no choice in the data.
Wrap: this is what shows as the result of your selection, so it's up to you - you can leave it as true, or set it to false, whichever looks better.
Now, the listbox will by default form part of your DataCard height but we only want it to do so when it's visible.
To auto-adjust the height of your DataCard, set the Height property as follows;
DataCardValueN.Y + DataCardValueN.Height + If(showList, ListBox1.Height, 0)
and the value to write back to SharePoint when you submit the form;
I think that should be it...reads like a blog post, but hopefully it helps you, if not someone else 🙂
I appreciate you taking the time to write out your solution. I actually tried it out on a different PowerApp and it worked. The only problem is that my original PowerApps has over 80+ dropdown fields and it's a bit unrealisitic for me to create a pseduo dropdown 80+ times, even if I copy paste the template for each question. Thanks for the solution though, and I'm open to other who think they have the solution to my problem.
Indeed, even knowing the basics and being able to do it fairly quickly - I wouldn't want to do it more than one or two times in an app!
The only thing I can suggest is to post an idea for multi-line/wrap capability in dropdowns.
Thanks for your feedback, I have made a test and the issue is confirmed on my side.
I agree with @RusselThomas's thought almost. If you want to expand the cut off dropdown choices and the question labels within the Combo box control, I afraid that there is no way to achieve your needs in PowerApps currently.
If you would like this feature to be improved in PowerApps, please submit an idea to PowerApps Ideas Forum:
Hi Russel! Thanks for this solution! I was able to create the custom "dropdown" box; however, I'm having an issue where if I put it inside a gallery and click on the arrow/box icons every list box opens. Is there a way to prevent this and only have the selected dropdown/list box open?
Learn how to create your own user groups today!
Check out the new Power Platform Community Connections gallery!
Congratulations, the new Super User Season 2 for 2021 has started!
Power Platform release plan for the 2021 release wave 2 describes all new features releasing from October 2021 through March 2022.