jqgrid условное форматирование.

Question

Я пытаюсь добавить условное форматирование в jqgrid, используя после вставки строки.Однако, похоже, ничего не происходит.Я использовал afterInsertRow в прошлом, и это сработало.Какие-либо предложения?

jQuery("#gridDevicePlan").jqGrid
    ({ 
        url:'/dashboard/summarydeviceplans', 
        datatype: "json", 
        colNames:['Temporal','Short Name','Customer', 'Start', 'End', 'Duration', 'Device Count'], 
        colModel:[  {name:'Temporal',index:'Temporal'},
                    {name:'ShortName',index:'ShortName'},
                    {name:'Customer',index:'Customer'},
                    {name:'DateStart',index:'DateStart',formatter:'date', formatoptions:{srcformat:'Y-m-d H:i:s', newformat:'m/d/Y H:i'}},
                    {name:'DateStop',index:'DateStop',formatter:'date', formatoptions:{srcformat:'Y-m-d H:i:s', newformat:'m/d/Y H:i'}}, 
                    {name:'Duration',index:'Duration'},
                    {name:'DeviceCount',index:'DeviceCount'}
                    ],
        //multiselect: true,  
        rowNum:10, 
        rowList:[10,50,100,300],
        //autowidth: true,
        autowidth: true,
        height: 'auto', 
        pager: '#pagerDevicePlan', 
        sortname: 'ShortName,Customer,DateStart', 
        mtype: "POST", 
        editurl:'/deviceplan/abort',   
        postData:{'deviceIDs[]':$('#device').val(), 
                  'timezone':<?="'".$this->criteria['timezone']."'"?>,
                  'gmtStartDate':<?="'".$this->criteria['gmtStartDate']."'"?>,
                  'gmtStopDate':<?="'".$this->criteria['gmtStopDate']."'"?>           
                 },
        viewrecords: true,
        sortorder: "asc",
        grouping: true,
        caption:false, 
        afterInsertRow: function(rowid, aData) {  //set condiditonal formatting
            alert(aData.Temporal);
            if(aData.Temporal != 'Current'){
             $("#"+rowid).addClass("ui-state-error");
            }
        } 
    }); 
    jQuery("#gridDevicePlan").jqGrid('navGrid','#pagerDevicePlan',{edit:false,add:false,del:false});

Answer 1

Я рекомендую вам никогда не используйте afterInsertRow. Вместо этого вы всегда должны использовать параметр gridview: true, который увеличивает производительность jqGrid без каких-либо недостатков. Если вы используете gridview: true, заполнение тела сетки будет сначала построено как строка, представляющая соответствующий фрагмент HTML, а затем тело будет помещено на страницу как одна операция. Вы не можете использовать gridview: true вместе с afterInsertRow. Если вы используете afterInsertRow, то строки сетки будут размещаться на странице последовательно, а затем будут называться afterInsertRow после добавления каждой строки. Для размещения любого элемента страницы требуется, чтобы веб-браузер пересчитал все позиции всех элементов на странице . Которые делают наполнение сетки очень медленно.

Вместо этого вы должны перечислить строки сетки внутри loadComplete и добавить класс «ui-state-error» в некоторые строки сетки. Кстати вызов $("#"+rowid).addClass("ui-state-error"); тоже неэффективен в цикле. Элемент <table> DOM (jQuery("#gridDevicePlan")[0] или this внутри loadComplete) имеет свойство row , которое очень эффективно для перечисления строк. Если вам нужно найти строку таблицы / сетки по rowid, вы можете использовать другой метод DOM namedItem из строк . Он находит строку в сетке более эффективно.

Решение вашего основного вопроса вы найдете здесь . Соответствующая демонстрация работает очень быстро, даже если в сетке относительно много строк.