Determine if in line editing has cell open and invalid

[Scott Waye]

Hi,

I have a grid with inline editing.  Outside of the grid is a submit button.  When clicking submit I want to check that editing is complete and valid before making the ajax call.  For example, the user adds a new row, one of the fields is required, but before filling it in the user clicks Submit.  How can I determine that the current edit cannot be completed as the row is invalid and hence cancel the submit allowing the user to fix the validation error? 

 

Thanks,

Scott

[Viktor Tachev]

Hello Scott,

In order to add validation to the Grid you can specify DataAnnotation Attributes in the Model. Please examine the article below that describes in more detail how you can setup validation for the model.

• http://docs.telerik.com/aspnet-mvc/getting-started/validation

Regards,
Viktor Tachev
Telerik by Progress

[Scott Waye]

HI Victor, This is not related to MVC, and I know how to add validation to the model.  The question is how, from a button click in Kendo UI, to determine if there is a cell in edit which is invalid.  Do you need a dojo?

[Viktor Tachev]

Hi Scott,

Please examine the following thread that discusses similar scenario to the one you have - with an external button and inline editing.

• http://www.telerik.com/forums/kendo-grid-row-validation#KYOTcjwjRkKQPMoE6AePog

Give the approach a try and see how it works for you.


Regards,
Viktor Tachev
Telerik by Progress

[Scott Waye]

I;m not being clear.  See this dojo

http://dojo.telerik.com/IluQU

Click to add a new row.  Do not fill the product name field.  Click the submit button.  In the alert where I have "???" I want to show true/false depending on whether the grid is valid, i.e. in this case, as the product name is not valid, it should show false.

[Viktor Tachev]

Hi Scott,

Please examine the modified sample that illustrates the approach you can use. You can search for the k-invalid class that would indicate the Grid is not valid.

• http://dojo.telerik.com/IluQU/3

Regards,
Viktor Tachev
Telerik by Progress

[Scott Waye]

Hi Viktor,

This does not work reliably.  Click the Run button in the dojo, click the "Add new Record" button.  Click the submit button.  The message says the grid is valid, although the product name is empty.

[Viktor Tachev]

Hello Scott,

I tested the behavior and the sample works as expected on my end. The message shows false when the input is empty. I also made a short video of the behavior I am observing. Please take a look and let me know if I am missing something.

• https://www.screencast.com/t/g1hL9eI0AT

Regards,
Viktor Tachev
Telerik by Progress

[Scott Waye]

HI Viktor,

Thanks for the video.  I see that it works fine for you, but I do the same and it doesn't work here.  Looks like you are using Firefox, is that right? 

Here is my video with Firefox: https://www.screencast.com/t/lFnl7yWW

I tried Edge and that works, so perhaps its some race condition.  For info I'm using Firefox 51.0.1 (32-bit) on Windows 10 64 bit.

[Konstantin Dikov]

Hello Scott,

I have tested the dojo example in the same version of Firefox and the grid is not valid. Nevertheless, the problem that you are facing seems to be a timing issue caused by some difference in the sequence of events (the blur event of the input element, the setting of the invalid class name and the click of the button). Currently, the only thing that I can suggest to overcome the problem in question is to wrap the logic within the click event handler within a setTimeout function and ensure that the invalid class is included. Can you please give this a try and see if this resolved the issue on your side.

Looking forward to your reply.
 

Regards,
Konstantin Dikov
Telerik by Progress

[Scott Waye]

yes, adding a timeout does seem to fix the problem:

http://dojo.telerik.com/IluQU/4

I don't like the solution so I'll raise a suggestion to make this less, well, hackish.

Thanks for the help.