Wijmo UI for the Web
Setting Cell Style

You can customize the appearance of cells by using the cellStyleFormatter method. The cellStyleFormatter allows you to change the font color and font style of the selected cell depending on its state.

For example, the script below changes the font style of the selected cell to italic.

Script
Copy Code
<script id="scriptInit" type="text/javascript">
    require(["wijmo.wijgrid"], function () {
        $(document).ready(function () {
            $("#wijgrid").wijgrid({
        
                cellClicked: function (e, args) {
                    alert(args.cell.value());
                },
                allowSorting: true,               
                data: [
                    [27, 'Canada', 'Adams, Craig', 'RW'],
                    [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
                    [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
                    [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
                    [1, 'United States', 'Curry, John', 'G', 'L'],
                ],
                columns: [
                    {headerText: "Number", dataType:'number'},
                    {headerText: "Nationality", dataType:'string'},
                    {headerText: "Player", dataType:'string'},
                    {headerText: "Position", dataType:'string'}     
                ],          
                highlightCurrentCell: true,
            cellStyleFormatter: function(args) {
                if ((args.row.type & wijmo.grid.rowType.data)) {
                    if (args.state & wijmo.grid.renderState.current) {
                        args.$cell.css("font-style", "italic");
                    } else {
                        args.$cell.css("font-style", "normal");
                    }
                }
            }

        });
    });
    });
</script>