2016-05-25 38 views
0

我正在根據特定條件設置行顏色。我有幾個網格有幾行。此代碼是severley減慢頁面加速JQGrid突出顯示GridComplete上的行

function setRowColorSetgrid() { 
     var rows = $("#Setgrid").getDataIDs(); 
     for (var i = 0; i < rows.length; i++) { 
      var status = $("#Setgrid").getCell(rows[i], "value"); 
      if (status == "False") { 
       $("#Setgrid").jqGrid('setRowData', rows[i], false, { 
        color: 'white', 
        weightfont: 'bold', 
        background: 'red' 
       }); 
      } 
     } 
    } 

//Have a function to set color for each grid I am loading 
    function setRowColorSomeOthergrid() { 
     var rows = $("#SomeOthergrid").getDataIDs(); 
     for (var i = 0; i < rows.length; i++) { 
      var status = $("#SomeOthergrid").getCell(rows[i], "value"); 
      if (status == "False") { 
       $("#Somethergrid").jqGrid('setRowData', rows[i], false, { 
        color: 'white', 
        weightfont: 'bold', 
        background: 'red' 
       }); 
      } 
     } 
    } 

的加載在網格中完成的jqGrid的我調用這個

gridComplete: function(){setRowColorSetgrid();} 
    //Have a grid creation funcrtion for all the grids I am loading 
     gridComplete: function(){setRowColorSomeOthergrid();} 

這使頁面真正的大,我想是因爲我在尋找一個狀態每個網格中的每一行「假」其採取永遠載入

我怎樣才能把我的javascript代碼到不具有setRowColor ...功能每個網格

我還可以使用其他什麼邏輯來設置基於字段值的行顏色,該字段值的性能會更好?

這是我的jqgrid。類永遠不會被應用,但是功能確實致力於通過行

function INIFiltersgrid() { 
      var data = [ 
       ['INI Exception', 'False', 'INI Path: Not Found'], 
      ]; 
      $("#INIFiltersgrid").jqGrid({ 
       datatype: "local", 
       height: 500, 
       width: 900, 
       colNames: ['Name', 'Passed', 'Value'], 
       colModel: [{ 
        name: 'name', 
        index: 'name', 
        width: 90 
       }, { 
        name: 'value', 
        index: 'value', 
        width: 60 
       }, { 
        name: 'passed', 
        index: 'passed', 
        width: 240, 
        height: 400 
       }], 
       gridview: true, 
       rowattr: function (rd) { 
    if (rd.value === "False") { // verify that the testing is correct in your case 
     return {"class": "myAltRowClass"}; 
    } 
       caption: "INIFilters" 
      }); 
      var names = ["name", "value", "passed"]; 
      var mydata = []; 
      for (var i = 0; i < data.length; i++) { 
       mydata[i] = {}; 
       for (var j = 0; j < data[i].length; j++) { 
        mydata[i][names[j]] = data[i][j]; 
       } 
      } 
      for (var i = 0; i <= mydata.length; i++) { 
       $("#INIFiltersgrid").jqGrid('addRowData', i + 1, mydata[i]); 
      } 
      $("#INIFiltersgrid").jqGrid('setGridParam', { 
       ondblClickRow: function(rowid, iRow, iCol, e) { 
        alert('double clicked'); 
       } 
      }); 
     } 

回答

1

迭代您應該使用rowattr回調函數,允許添加類或設置在一些行的某些屬性(如style="...")。有關相應的代碼示例,請參見the old answer。另外使用gridview: true選項很重要(請參閱[答案])。如果您使用free jqGrid,那麼gridview: true選項已經是默認值。我不建議你使用gridComplete。回調loadComplete在大多數情況下更好。有關更詳細的說明,請參見the answer

已更新:永遠不要在循環中使用addRowData來填充網格。這是最糟糕的方式,我知道填補網格(最慢)。如果您需要填寫網格mydata,那麼您應該只添加data: mydata選項到網格。此外,如果您使用我在答案中推薦的jqGrid的免費jqGrid分支,那麼即使您使用addRowDatarowattr仍將應用。如果您使用舊的jqGrid,則將添加addRowData的行,將添加,而不應用應用rowattr

+0

rowattr命中該功能,但無論我做什麼都不適用樣式 – nlstack01

+0

@ nlstack01:您應該發佈您使用的代碼。你試過了什麼?知道哪個jqGrid版本以及您使用哪個分支可能很重要。 – Oleg

+0

我添加了我的jqgrid實現 – nlstack01