Wijmo WjFlexGridColumn WordWrap Bug

Wijmo WjFlexGridColumn WordWrap Bug

Posted by: kevin.thalmann on 25 April 2018, 4:20 am EST

• 

  kevin.thalmann

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 25 April 2018, 4:20 am EST

  Hello,

  we encountered the problem that word wrap does not work with normal binding. If we do the binding like this:

  
  <wj-flex-grid-column header="Name" binding="name" [width]="200" wordWrap="true">
   </wj-flex-grid-column>
  
  

  It only works when we do it with a cell template like this:

  
  <wj-flex-grid-column header="Name" [width]="200" wordWrap="true">
         <ng-template wjFlexGridCellTemplate cellType="Cell" let-cell="cell">
                     {{ cell.item.name }}
          </ng-template>
   </wj-flex-grid-column>
  
  

  we have a lot of cases, where we just have a binding without a template. We don’t want to change them all to a cell template just to get word wrap working.

• 

  kevin.thalmann

  • Post Options:
  • Link
    Copy

  Posted 25 April 2018, 4:41 am EST

  Just to clarify, the text gets put on a new line, but the wijmo row does not extend its height. Thus the second line is almost not visible. You can only see the upper part of the letters.

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 26 April 2018, 9:35 am EST

  Hi,

  This is by design. Column wordWrap property is used for inserting extra text into new line.
  
  To resize row height based on content, you should call autoSizeRow (For specific row)/autoSizeRows(For all rows) methods.

  Please refer to the following example:- https://stackblitz.com/edit/angular-hesgml?file=app%2Fapp.component.html

  ~Manish

• 

  moritz.neugebauer

  • Post Options:
  • Link
    Copy

  Posted 22 June 2020, 5:33 am EST

  Dear Manish,

  navigating between the line in one cell works with arrow keys by default. Is it possible to add a new line into a cell with the keyboard?

  When pressing Shift+Enter the selection jumps to the next cell.

  Best regards
  
  Moritz

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 23 June 2020, 3:23 am EST

  Hello Moritz,

  You can use Alt + Enter to move to the next line while editing the cell. But before using this, please make sure that you have set the multiLine property of the Column to true.

  flexgrid.columns[0].multiLine = true;
  

  Regards,
  
  Ashwin

• 

  moritz.neugebauer

  • Post Options:
  • Link
    Copy

  Posted 23 June 2020, 3:58 am EST

  Hi Ashwin,

  the property multiline was already set to true, so Alt + Enter was exactly what I needed. It works like a charm. Thank you very much!

  Best regards
  
  Moritz