In Grid.js, I would like to change the text color of a table cell depending on its value.
new gridjs.Grid({
columns: [
{ id: 'testcase', name: 'Test case' },
{ id: 'date_run', name: 'Date run', sort: false },
{ id: 'result', name: 'Result', sort: false },
],
data: [
{% for user in users %}
{
testcase: '{{ user.testcase }}',
date_run: '{{ user.date_run.strftime('%H:%M %d-%m-%Y') }}',
{% if user.result == "Pass" %}
result: '{{ user.result }}',
{% else %}
result: '{{ user.result }}',
{% endif %}
},
{% endfor %}
],
search: {
selector: (cell, rowIndex, cellIndex) => [0, 1, 4].includes(cellIndex) ? cell : null,
},
sort: true,
pagination: true,
width: 1000
}).render(document.getElementById('table'));
user.result is a string, taking the values 'Pass' or 'Fail'. If the value is 'Fail' I would like the text to be red, if 'Pass' black. How can I achieve that?
Actually, it would be better for the database value to be a boolean, how should the if syntax be changed for that?