Wordwrap with button | Infragistics Forums

Wordwrap with button

Mario Ruiz posted over 3 years ago

I am oupando igxGrid, I want to do a line wrap via button.

the first instance looks like this:

using the button that performs the line wrapping:

Thank you.

Parents

No Data

Reply

1500

Offline Tihomir Tonev posted over 3 years ago

Hello,

Thank you for posting on our forums.

You can use the cellStyles property exposed by igxColumnComponent in order to apply styling of the cells on demand. More information can be found on our website here:

https://ko.infragistics.com/products/ignite-ui-angular/angular/components/grid/conditional-cell-styling

I have prepared a sample for you to demonstrate how to apply css variables on a button click.

https://stackblitz.com/edit/igx-grid-change-cell-style-button

Should you have any further questions, please let me know.

Sincerely,
Tihomir Tonev
Associate Software Developer
Infragistics
Cancel
Reply

Cancel

Children

Offline Mario Ruiz posted over 3 years ago in reply to Tihomir Tonev

I tried your example, but it doesn't do the line wrap

In your code snippet, I see that you do "word-wrap": "break-word"

public changedStyles = {
    background: "linear-gradient(to right, #b993d6, #8ca6db)",
    "font-weight": "bold",
    color: (rowData, coljey, cellValue, rowIndex) =>
      rowIndex % 2 === 0 ? "white" : "gray",
      animation: "0.75s popin",
      "word-wrap": "break-word",
  };

I already tried other options:

white-space: pre-wrap! important;
overflow-wrap: break-word;

white-space: none;

Any other option?