Hello all, I'd like to know if there is a way to show multiple lines and add some formatting to cells in a datatable,
i was trying to use the body property setting this value:
<p>Hello World!</p><p><span style="background-color: rgb(255, 255, 0);">PrimeReact </span><strong style="background-color: rgb(255, 255, 0);">Editor</strong><span style="background-color: rgb(255, 255, 0);"> Rocks</span></p><p>this is other line</p><ol><li>element one</li><li>element two</li></ol>
but displays the whole string, which is not what I need, what I want to show is something like this:
Hello World!
PrimeReact Editor Rocks
this is other line
1. element one
2. element two
Also the other features work as expected, filters, sorting, etc.
Thanks in advance.
multiple lines and format in datatable cells
Did you try body templating? Also, you need to use style as an object. Please, try code like the below;
Code: Select all
colorTemplate(rowData, column) {
return <span><p>Hello World!</p> <p><span style={{backgroundColor: 'rgb(255, 255, 0)'}}>PrimeReact </span><strong style={{backgroundColor: 'rgb(255, 255, 0)'}}>Editor</strong><span style={{backgroundColor: 'rgb(255, 255, 0)'}}> Rocks</span></p><p>this is other line</p><ol><li>element one</li><li>element two</li></ol></span>;
}
Code: Select all
<Column field="color" header="Color" body={this.colorTemplate} />