Line break in cell jquery-bootgrid - jquery-bootgrid

Question

There is a way to make visible a <br> inside a cell using jquery-bootgrid? Because the render of <br> is not visible.

Answer 1

What I understand is that you want to add a line break in your data, something like this,
In the features column I am passing an array and it displays each Item in a separate row using <br>
For this you can create a custom converter,
http://www.jquery-bootgrid.com/Documentation#converters
You can create the converter when initializing the BootGrid Table
var dt = $('#myTable').bootgrid({
//.......... Other Options
converters: {
listDisplay: {
from: function(value) {
return value;
},
to: function(value) {
// Here you can customise value - I have an Array which I join using <br>
value.sort();
value = value.join("<br/>");
return value;
}
}
}
});
Then all you have to do in the Table HTML is set the data-type on the Column heading
<table id="myTable">
<thead>
<tr>
<th data-column-id="Id" data-visible="false" data-identifier="true" data-type="numeric">Id</th>
<th data-column-id="SelectedFeaturesNames" data-type="listDisplay">Features</th>
<!-- Note the data-type on the Features <th> is listDisplay -->
</tr>
</thead>
<tbody></tbody>
</table>

Answer 2

Did it work using that method?
Yes #Dawood Awan ! It worked for me
PHP:
<td>
<?php
$test = ['b', 'a', 'c'];
echo json_encode($test);
?>
</td>
JS:
to: function(value) {
value = JSON.parse(value); //convert received json to js array.
value.sort();
value = value.join("<br/>");
return value;
}