Hello there,
I would like to ask about displaying multiple data in a cell using customRenderer. I tried to find many references but no good result / article appear.
Let’s say I have data such as below:
var data = [{
name: 'John Doe',
project: 'Artificial Intelligent',
language: 'Python',
location: 'Japan'
},{
name: 'Nakamura',
project: 'iOT',
language: 'NodeJS',
location: 'Japan'
}];
and I want to create a table like below:
<table>
<tr><th>Name</th><th>Location</th><th>Info</th></tr>
<tr><td>John Doe</td><td>Japan</td><td>Artificial Intelligent<br>Python</td></tr>
<tr><td>Nakamura</td><td>Japan</td><td>iOT<br>NodeJS</td></tr>
</table>
Name | Location | Info
John Doe | Japan | Artificial Intelligent **`<br>`** Python
Nakamura | Japan | iOT <br>
NodeJS
Sorry, it’s hard to create a table in this message, but the point is I need to show multiple data from different key and combine them using <br>
into third column. In the real case it will not only combining with new line but also modification of the html too.
The problem is, in my customRenderer function, it only sends the value of the column.
// my columns setting
.....
{
data: 'language',
editor: false,
className: 'htMiddle',
renderer: myCustonRenderer
},
.....
// this is the custom renderer function. What should I write in ???????
function myCustonRenderer (instance, td, row, col, prop, value, cellProperties) {
td.innerHTML = value + "<br>" + ???????;
return td;
}
Thank you.