Change cell text color after input

[Steven]

Hi - I currently have an editable cell in my grid, and after the cell closes I want the text to change color. Is there a way to do this?

[Steven]

I figured it out.

 

$('td').each(function() {
    if ($(this).text() == newValue) {
        $(this).addClass('success');
    }
});

[Steven]

Sorry for the multiple posts, the above actually loops the grid and sets all cells that match my new value to the success class. I only want that specific cell changed.

[Nikolay]

Hello Steven,

To achieve text coloring once a cell is edited you can apply a single CSS rule:

td.k-dirty-cell {
       color: orange;
     }

Once a grid cell is eddited it automatically receives class .k-dirty-cell.

Please review the demo I have prepared for you:

• https://dojo.telerik.com/uMOSEHeq/2

Hope this helps and if there is anything we could assist further, please contact us back.

Regards,
Nikolay
Progress Telerik

[Steven]

After looking at the html for an updated td in my grid, kendo isn't adding the .k-dirty-cell class for me. I'm not exactly sure why mine doesn't but yours does.

[Steven]

Sorry again for the multiple posts. Upon further examination it looks like the dirty class is being added after the edit, but after the edit function ends, it removes the class.

On edit - it adds k-edit-cell

After edit - it becomes k-edit-cell.k-dirty-cell

After the edit blur function ends, it removes all classes.

[Nikolay]

Hi Steven,

On the demo I have provided you everything works as described. Once the edit of a cell finishes the .k-dirty-cell class is not removed.

Is there a chance you have set "autoSync: true" in your dataSource? This automatically saves any changed data items by calling the sync method.

If possible please provide your configuration so I can examine and advise.

Regards,
Nikolay
Progress Telerik