Solved

Drop-down list unable to display full details

  • 6 March 2019
  • 8 replies
  • 122 views
H

Hi,

As screenshot below, may I know how to wrap text in drop down list?

 

12790i424D5D400D109625.jpg

 

icon

Best answer by Widson 7 March 2019, 14:07

View original

8 replies

W

Hi K2 Developer 

 

Please navigate to this link https://help.k2.com/onlinehelp/k2five/userguide/5.2/default.htm#Tutorials/Advanced/Expense%20Claim/02Forms/08CreateExpClaimDetailsView.htm

 

You should find text wrap drop-down checked as attached in the screenshot below:-

 

Please feel free to ask for further clarity ,Should you feel that this post is of use and or an accurate solution to the raised question, I kindly encourage you to mark it as such using the 'Mark as Solution', 'Kudo' andor ‘Me Too’ options.

 

Kind Regards

Widson

 

K2 will not accept any liability for any issues arising from actions taken in respect of the information provided by any forum member

H

Hi Widson,

 

Thanks for you reply.

I can't find "Wrap Text" checkbox in properties tab.
For your information, I am trying to do the setting in drop down list control instead of list view.

E
Badge +9

Hi

 

dropdown controls were not origionally designed to accomodate for extremely long text but rather to contain short key word for user to do quick selecting, this would also explain why the control does not have a wrap text option and in return displays the dotted dots as representation of continuing text. Logging this as a feature to obtain the ability to wrap text on those controls should resolve this issue. 

 

Additional Note: I also noticed that none of the List controls hav ethe wrap text options (checkbox list, radio button list, dropdown list, choice control, etc)

 

K2 will not accept any liability for any issues arising from actions taken in respect of the information provided by any forum member.

 

Kind Regards

Elvis

 
RaymondJVR
Userlevel 4
Badge +13

Hi Hmhok


 


For an out of the box solution to wrap your drop down lists selection options I would agree logging a feature request for the functionality would be your best best. You can do so using the following link: https://ideas.k2.com/ideas/new


 


As for an non out of the box solutionworkaround, you can make use of the following custom code, please see the steps below on how to use it:



Step 1: add a data label to your design canvas, ensure that this data labels literal property is enabled and that the xss property is disabled.



Step 2: Create a new expression and add the following jQuery to it - call this expression "Change A"


$('li').css({"height":"50px"});


Step 3: Create another expression and add the following jQuery to it - call this expression "Change B"


$('span').css({"overflow":"visible"});


Step 4: Create another expression and add the following jQuery to it - call this expression "Change C"


$('a').css({"text-overflow":"clip","white-space":"pre-wrap","word-wrap":"break-word","overflow":"visible"});

Step 5: Create the last expression and add all the other expressions into this one opening and closing the expression with the script tags - call this expression "Main Expression". For Example:


<script>ChangeA ChangeB ChangeC</script> 


 


Step 6: On the initialize rule, add a transfer data rule then pass the expression created in step 5 (Main Expression) onto the data label which had been created in step 1.



Result:



 


Note: This change will wrap the text in you selectable options within your drop down list however the on hover color change will now seem out of sync when attempting to make a selection from the dropdown list as the wrapped section of the text will not be included in the color change when hovering over an option. also note my testing was done only based on static values.


 


In addition to the above please keep in mind that K2 will not take any liability for any custom code or custom changes made nor will they support it. 


 


References :


The expression used in step 4 can also be used to auto fit and wrap text within a button.


https://community.k2.com/t5/K2-Cloud/Auto-Resize-A-Button/td-p/108474


 


Should you feel that this post is of use and or an accurate solution to the raised question, I kindly encourage you to mark it as such using the 'Mark as Solution', 'Kudo' andor ‘Me Too’ options.


 


Kind Regards


Raymond


 

W

Hi hmkok

 

I continued with the investigation and that's a limitation for now and it should be voted for future consideration from here https://ideas.k2.com/ideas/APIT-I-365  Drop down List Control does not wrap text by design. Basically:-
If the text is longer than the allocated length, the text is getting cutoff. 

Typically on other websites the text box will float above the content and expand as needed.  
Once the user has entered their data and either wants to add/edit more rows or continue populating the form and the list item switches to a "read" type of view, the contents of the drop-down columns get cut off if they are beyond the allocated length of the column.
Alternatives:

-Is to expand your cell manually and if you are using drop down List you'll have to change Stacked By property or No. of Items (per row/column) property.

- Or make use of the style sheet as it was done in the following article https://help.k2.com/support-services/kbt151516.

 

Kindly feel free to Mark as "Accepted Solution, Kudo and/or MeToo" if you find this information answered your question or leads you to the answer.

 

Thank you,

Widson.

 

K2 will not accept any liability for any issues arising from actions taken in respect of the information provided by any forum member.

E
Badge +9

Hi  hmkok

 

Please follow the steps bellow:

  • .Add the text box on itemview
  • Now you can click drop down list  and select the  sentance you want.

 

Please dont forget to mark this article as both KUDOS and solution or Kudos only

 

Regards

Elvis

J


Good day hmkok

 

There is no ootb function like this as of yet. An easy alternative is to set the with of the dropdown, found in the property pane under "General", slightly wider to accommodate the cut of strings. See the screenshots below:

 

1. With is 20% and the test string is cut off

 

If this post answered your question would you be so kind as to mark it as a solution/Kudo?

 

Thank you in advance

Kind Regards

Jacques.


[K2 will not accept any liability for any issues arising from actions taken in respect of the information provided by any forum member]

H
Hi Widson,
Edit stylesheet can solve this problem.
Thank you very much!

Reply


View our Community Site Map

Nintex Community Sitemap
Terms & ConditionsCookie settings