Cascaded dropdowns validation tooltip is shown initially in Kendo editor edit form

[mparvanov]

Bug report

Cascaded dropdowns validation tooltip is shown initially in Kendo editor edit form

Reproduction of the problem

Use the setup for Kendo Grid handling cascading dropdownlists with popup from the following sample project:
https://github.com/telerik/ui-for-aspnet-mvc-examples/tree/master/grid/grid-editing-cascading-dropdownlist
Open the first grid Edit form by clicking on the Add button

Current behavior

The cascaded dropdowns validation tooltip is shown initially

Expected/desired behavior

The cascaded dropdowns validation tooltip is not shown initially

Video of the reproduction: http://screencast.com/t/RizV7BF7LW

Environment

Kendo UI version: The issue is reproduced since Q1 2016

[ggkrustev]

@mparvanov @IvanDanchev The described behavior is expected, although not very intuitive. It is caused by this feature:

• Change event not fired on cascaded ddl with MVVM

The desire to support the model synchronization properly won over the unintuitive 'error message'.

I am afraid that I cannot think of any workaround that could overcome the discussed issue. Pull requests with a proper solution are always accepted though :).

[danail-vasilev]

@danielkaradachki suggested to workaround that behavior by making the model fields nullable.

[ggkrustev]

I would close this issue with Won't fix as the behavior is intended (described in #661)

[Vince-31]

In case anyone is still searching, as this is the only suggested result on google, here's my workaround.

You can bind the "onValidateInput" event of a validator to a handler which hides the error message if the control to validate is disabled. This gets you the same behavior as in earlier versions of Kendo.

//Bind the validateInput event of the validator
//Here I'm within a grid edit pop-up so I used getKendoValidator()
container.getKendoValidator().bind("validateInput", _me.onValidateInput);

//Handler that hides the error messages
function onValidateInput(e)  {
        if (e.input[0].disabled) {
            $(e.input[0]).next(".k-widget.k-tooltip-validation").each(function () { $(this).hide() });
        }
        else if (!e.valid) {
            $(e.input[0]).next(".k-widget.k-tooltip-validation").each(function () { $(this).show() });
        }
 };