как установить цвет ячейки jqgrid во время выполнения

Question

Я заполняю jqgrid из базы данных, и один из его столбцов является цветным столбцом, таким как красный, синий и т. Д. Могу ли я установить цвет ячейки этого столбца на основе значения, поступающего из базы данных во время выполнения? Как мне установить форматтер в этом случае? я пытался так, но не работает

var colorFormatter = function(cellvalue, options, rowObject) {
        var colorElementString = '<div class="colorBlock" style="background-color: red;"></div>';
        return colorElementString;
---
---
colModel: [
                { name: 'GroupName', index: 'GroupName', width: 200, align: 'left' },
                { name: 'Description', index: 'Description', width: 300, align: 'left' },
                { name: 'Color', index: 'Color', width: 60, align: 'left', formatter: colorFormatter}],

Answer 1

Добавить вызов завершения загрузки к функции, которая форматирует цвета:

loadComplete: function (data) {
    $.each(data.rows, function (i, item) {
        var rowId = data.rows[i].id || data.rows[i]._id_;
        var myRow = new Array(item.valueOf());

        jQuery('#' + grid).setCell(rowId, colName, '', { background: 'red'});
    });
}

Вам просто нужно добавить код для проверки условий, которые вы хотите применить.

Answer 2

Я меняю цвет фона для строки в зависимости от статуса («status» - столбец данных)Надеюсь, это поможет.Вот пример кода:

<style>
    .state_inactive {
        background-color:##FF9999 !important;
        border:1px solid ##A6C9E2;
        color:##222222;
    }
</style>

<script type="text/javascript">
    $j("#Grid").jqGrid({
        url:"getData.php",
        datatype:"json",
        colNames:['Name', 'Organization', 'Status'],
        colModel:[{name:'name', index:'name'}, {name:'organization', index:'organization'}, {name:'status', index:'status'}],
    },
    gridComplete:function() {
        var ids = jQuery("#Grid").jqGrid('getDataIDs');

        for (var i = 0; i < ids.length; i++) { 
            var status = jQuery("#Grid").jqGrid("getCell", ids[i], 'status');

            if (status == "-20") {
                $j('#' + ids[i]).removeClass("ui-widget-content");
                $j('#' + ids[i]).addClass("state_inactive");
            }
        }
    })
</script> 

Answer 3

Похоже на недостаток дизайна jqgrid.

Лучший способ - реализовать это во время загрузки, а пользовательский форматер имеет значение только там, где вы можете это сделать. Но вам нужно сделать это не на значении, а на div или span перед ним.