單元格編輯後的SlickGrid樣式

我使用slickGrid（2.0）dataView和slick.editors。在網格中，用戶可以編輯任意數量的單元格，然後修改底層網格數據，以便在網格滾動時保持編輯。這很好。但我也希望爲所有編輯提供視覺反饋，因爲直到用戶點擊「保存編輯」按鈕，這些編輯纔會保存到數據庫。單元格編輯後的SlickGrid樣式

問題是編輯器方法在讀取更改後的網格數據後重置單元格。我需要保持背景顏色變化以表明它已被編輯。有沒有人能夠做到這一點？

這裏是培訓相關的代碼（簡單的整數編輯）：

function IntegerCellEditor(args) { 
    var $input; 
    var defaultValue; 
    var scope = this; 
    this.init = function() { 
     $input = $("<input type=text class='edited' type=text style='font:normal 12px arial; width:95px; text-align:right; border:none;' />"); 
     $input.bind("keydown.nav", function(e) { 
      if (e.keyCode === $.ui.keyCode.LEFT || e.keyCode === $.ui.keyCode.RIGHT) { 
       e.stopImmediatePropagation(); 
      } 
     }); 
    $('#saveChanges').removeAttr("disabled"); // remove disabled attribute from "Save Changes" btn 
     $input.appendTo(args.container); 
     $input.focus().select(); 
    }; 
    this.destroy = function() { 
     $input.remove(); 
    }; 
    this.focus = function() { 
     $input.focus(); 
    }; 
    this.loadValue = function(item) { 
     defaultValue = item[args.column.field]; 
     $input.val(defaultValue); 
     $input[0].defaultValue = defaultValue; 
     $input.select(); 
    }; 
    this.serializeValue = function() { 
     return parseInt($input.val(),10) || 0; 
    }; 
    this.applyValue = function(item,state) { 
     item[args.column.field] = state; 
    }; 
    this.isValueChanged = function() { 
     return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue); 
document.getElementsByClassName('ui-widget-content slick-row')[row].className += 'edited'; 
     }; 
     this.validate = function() { 
      if (isNaN($input.val())) 
       return { 
        valid: false, 
        msg: "Please enter a valid integer" 
       }; 
      return { 
       valid: true, 
       msg: null 
      }; 
     }; 
     this.init(); 
    }

這一行什麼也不做，我無法弄清楚如何做到這一點：

document.getElementsByClassName('ui-widget-content slick-row')[row].className += 'edited';

感謝

來源

2013-01-07 user1415445

我不是SlickGrid的專家，但看看Example 14，我認爲它有類似的信息，可以幫助你。

我的想法是這樣的：

訂閱grid.onCellChange事件
店對象
使用grid.setCellCssStyles（ '亮點'，變化）的變化來更新CSS或網格。 addCellCssStyles

希望至少有一點幫助。

來源

2013-01-07 23:44:34 James

謝謝......如果我能弄明白在哪裏實施它，那麼這可能會奏效。看起來不像Slick.Editor（s）喜歡它（拋出錯誤），但我已經開始跟蹤數組中的所有編輯/更改（實際上是3個數組，因爲我有3列可以編輯），並在每個編輯事件。這應該工作，但聽起來像是一個快樂的方式來做到這一點。所以......謝謝，我想這就是我要去的方式。 – user1415445

對於任何感興趣的人，下面是我如何解決這個問題的方法：在每個可編輯單元格的編輯器中，我附加了一個不間斷的空格（以便在重新編輯時不會顯示）。在每個可編輯單元格的格式化程序中，我只需檢查結束空間，將其切掉並應用高亮樣式。 – user1415445

單元格編輯後的SlickGrid樣式

回答

相關問題