gridjs: how to change background colors based on the row ID?

73 views Asked by At

I would like to change the background color of the rows in the table generated by gridjs.

I came up with the following line of code to change the style of the background color, but it has to be based on the 'Index' in the row (see below). I could not find an example on the web. If you think of a solution, please help me. Many thanks!

const grid2 = new gridjs.Grid({
    columns: [
    { id: 'index', name: 'Index' },
    { id: 'name', name: 'Name' },
    ],
    data: [

    {% for message4 in messages4 %}
        {
        index: '{{ message4['Index'] }}',
        name: '{{ message4['Name'] }}',
        },
    {% endfor %}
    ],
    search: true,
    sort: true,
    pagination: true,
    resizable: true,
    style: {
        tr: {
        {% for message4 in messages4 %}
            {% if message4['Index'] > 1 %}
            "background-color": "#d9dcde",
            {% else %}
            "background-color": "#e3bfcd",
            {% endif %}
        {% endfor %}
        },
    }
}).render(document.getElementById('grid_table_wikidata'));
0

There are 0 answers