Forums Ignite UI for React
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Yunhan Zheng
60
Auto wrap multiline text for table cell
posted

Hi,

I'm building a grid which may have a column that always has multiline text. 

Do you have examples for auto wrap multiline text in table cells and still maintaining the ability to pin columns?

Also as an alternative, do you have built-in components for tooltips if a cell has too long text? How can I override the column cell render logic so that I can add tooltip to those cells?

Thank you

Parents
No Data
Reply
  • 7535
    Offline posted

    Hello Yunhan,

    This is the duplicate case of CAS-210630-C5K2K1, which i have already answered so we may continue discussing the case through private case and this post may be close.

    Regarding the multiline text you ca use 'lineBreakMode' property of the textColumn.

    and for tooltip we do not have direct property /API so you can workaround by using template property of the column and hook a function like that -

    <IgrTemplateColumn field="Street" headerText="Address" template={this.getLongTextCell} width="*>150" />
    public getLongTextCell(props: IIgrCellTemplateProps) {
    const info = props.dataContext as IgrTemplateCellInfo;
    // return <span className={modules.LongTextCell} title={info.value}>{info.value}</span>;
    return <div className ="myClass" title={info.value}>{info.value}</div>;
    }
    Regards,
Children
No Data