When there are white value in FlexGrid's DataMap, the ListBox's height is not

When there are white value in FlexGrid's DataMap, the ListBox's height is not

Posted by: frhave on 19 December 2017, 5:36 am EST

• 

  frhave

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 19 December 2017, 5:36 am EST

  when there has white value in FlexGrid’s DataMap, the ListBox’s height is not right.

  steps:

  1. open the link http://jsfiddle.net/zhav1kjk/
  2. open the customer dropdown.
     
     you can see the first white value’s height is not right, it is because wijmo.escapeHtml doesn’t escapte " " to " ".

  thanks!

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 19 December 2017, 9:38 pm EST

  Hi,
  
  This can be overcome by defining min-height property to wj-listbox-item class. Please refer to the updated fiddle for the same.

  http://jsfiddle.net/mkgupta911/zhav1kjk/1/

  ~Manish

• 

  frhave

  • Post Options:
  • Link
    Copy

  Posted 20 December 2017, 2:50 am EST

  set the min-height only can resolve the display problem, it doesn’t real resolve the problem.
  
  because the item’s real value is one or more white space(ascii code 20) string, which length >= 1, but after fill it to the flexgrid’s listbox, the listbox change its value to a empty string which length = 0.
  
  so i don’t think set min-height is to resolve the problem, it is to only cover up the problem.
  
  this is a little problem for me, it is easy to resolve by rewriting wijmo.escapeHtml().

  thanks.

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 20 December 2017, 9:23 pm EST

  Hi,
  
  The value, retrieved using getCellData method, is correct with equals number of spaces. Spaced get trimmed when showing in Controls. Hence, your problem should be resolved by adding CSS to Control.

  Please refer to updated fiddle:

  http://jsfiddle.net/mkgupta911/zhav1kjk/2/

  ~Manish

• 

  ken_perregaux

  • Post Options:
  • Link
    Copy

  Posted 29 March 2018, 3:27 am EST

  I am using Wijmo 5.20171.282 with Angular 5 and inside my components CSS I put the min-height but it doesn’t get applied.

  The only way I could get it to apply my style was to set ViewEncapsulation.None but then the Wijmo base styling goes away.

  Sorry a bit new to this so how do I get this to work for me?

• 

  abhishek.dutta

  

  • Post Options:
  • Link
    Copy

  Posted 1 April 2018, 7:06 pm EST

  Hi,

  We are unable to reproduce the issue at our end.

  Here is an example in angular that set’s min-height inside components CSS and it seems to be working as expected.

  https://stackblitz.com/edit/angular-cs7vr1?file=app%2Fapp.component.css
  

  Could you please give more information about your use case or provide a small sample with your problem . Please feel free to edit the above code to reflect your problem.

• 

  ken_perregaux

  • Post Options:
  • Link
    Copy

  Posted 3 April 2018, 4:10 am EST

  Hi Abhishek, thanks for your reply but the problem is with the listbox (or combobox) if you want a blank entry not the whole grid.

  I tried Manishes answer and it didn’t get applied in my child component until I used the ViewEncapsulation.None and then of course all the original styling for the listbox is gone as well.

  Is there a good example on how to override some of the styling?

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 3 April 2018, 2:20 pm EST

  Hi,
  
  You can add this style to the styles.css file to apply among all ComboBox.

  .wj-listbox-item {      
        min-height:25px;      
  }
  

  Since dropDown for all ComboBox/AutoComplete render out of Component scope.

  ~Manish