Has anyone dealt with: DataTable before? Please advise.

[krishna_jpParticipant]

How do I customize cell rendering in jqxDataTable for conditional formatting using jQuery?

[adminKeymaster]

Hi,

This is definitely possible by using the cellsRenderer column callback function.

$("#myDataTable").jqxDataTable({
    width: 600,
    source: dataAdapter, // your data source
    columns: [
        { text: 'Name', dataField: 'name', width: 200 },
        { 
            text: 'Age', 
            dataField: 'age', 
            width: 100,
            cellsRenderer: function (row, column, value, rowData) {
                let cellStyle = '';
                if (value < 18) {
                    cellStyle = 'background-color: #FFCCCC; color: #900;';
                } else if (value >= 18 && value <= 50) {
                    cellStyle = 'background-color: #CCFFCC; color: #060;';
                } else {
                    cellStyle = 'background-color: #CCCCFF; color: #006;';
                }
                return <code><div style=&quot;width: 100%; height: 100%; padding: 5px; ${cellStyle}&quot;>${value}</div></code>;
            }
        },
        { text: 'Country', dataField: 'country', width: 200 }
    ]
});

Best regards,
Peter

jQWidgets team
https://www.jqwidgets.com/

[Author]

Posts