The dirty flag grid is not updated

I am having problems manually configuring / removing the dirty flag indicator in a Kendo web control.

I added a tutorial to keep dirty indicators to enable additional validation on the field value

during an event dataSource.change

:

• Previously saved value
  
  (containing id
  
  ) that was changed to 0 is a valid dirty flag ( e.items[0].id > 0 && e.items[0].value === 0
  
  )
• A value
  
  entered with a value greater than 0 is a valid dirty flag ( e.items[0].value > 0
  
  )
• Any other instance is value
  
  not a valid dirty flag and should therefore be removed
• If the user left the field value
  
  "empty", that is "null", change the value to 0 ( if (!e.items[0].value) {e.items[0].value = 0;}
  
  )

With these changes applied, the event change

now looks like this:

change: function (e) {
    if (e.action == "itemchange") {                
        if ((e.items[0].id > 0 && e.items[0].value === 0) || e.items[0].value > 0) {
            e.items[0].dirtyFields = e.items[0].dirtyFields || {};
            e.items[0].dirtyFields[e.field] = true;
            _dirty = true;
        }
        else {
            if (!e.items[0].value) {
                e.items[0].value = 0;
            }
            e.items[0].dirty = false;
            e.items[0].dirtyFields = e.items[0].dirtyFields || {};
            e.items[0].dirtyFields[e.field] = false;
        }
        $("#grid").data("kendoGrid").refresh();
    }
}

      

        
        
        
      

    

After making these changes, I see a function dirtyField

(which is a column template

of a value column), and can also display the corresponding values true

/ false

and the corresponding ones (which I thought should set / remove the "dirty flag" from the corresponding cells):

function dirtyField(data, fieldName){
    if(data.dirty && data.dirtyFields[fieldName]){
        return "<span class='k-dirty'></span>"
    }
    else{
        return "";
    }
}

      

        
        
        
      

    

However, the dirty flag is not removed until another cell in the grid is changed.

Here's a Dojo example to demonstrate the problem. To reproduce:

• Enter a value greater than 0 on the second line value
  
  (sets a dirty flag)
• Remove value from second line value
  
  ("dirty flag" left →> based on event logic change
  
  )
• Enter a value greater than 0 in the third row value
  
  (sets the dirty flag in the current cell, removes the dirty flag in the cell in the second row value
  
  )