Text change event during inline editing

1 Answer 46 Views
Grid
Miljan
Top achievements
Rank 1
Miljan asked on 13 Feb 2022, 06:33 PM
I have a request to make dynamic validation during typing the text in the grid cell and highlight the cell green when input is valid and red when not valid according to validation rules. Is there a way to do so with Kendo grid?

1 Answer, 1 is accepted

Sort by
0
Georgi Denchev
Telerik team
answered on 16 Feb 2022, 02:37 PM

Hello, Miljan,

You can utilize the edit event of the Grid and obtain a reference to the built-in validator of the Grid. Then you can attach an input event to the row inputs and trigger the validate() method anytime you type something. If the Grid validation fails, the error message will appear(without you having to click outside).

              	edit: function(e) {
                  let validator = e.sender.editable.validatable;
                  e.container.find("input").on("input", function(ev) {
                    validator.validate();
                  });
                }

Dojo example:

https://dojo.telerik.com/@gdenchev/UpObaZAg 

The ProductName, UnitPrice and UnitsInStock columns are all required. If you delete the content of the input, the error will be displayed immediately.

Best Regards,
Georgi Denchev
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Grid
Asked by
Miljan
Top achievements
Rank 1
Answers by
Georgi Denchev
Telerik team
Share this question
or