Firing kendo.ui.validator on Keyup

[Jordan]

I am using Kendo ASP.NET Core and have a grid which has popup editor using custom editor template.  I am doing some password complexity validation.

I want the validator fire on keyup.   It currently only fires on blur but this is not a good user experience.   The user will think they have not succeeded unless they blur.     

How can I achieve this?  Here is my validator.

 $.extend(true, kendo.ui.validator, {
            rules: { // custom rules
                passwordcomplexity: function (input, params) {
                    if (input.is("[name='Password']") && input.val() != "") {
                        return /^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@@$%^&*-]).{6,}$/.test(input.val());
                    }
                     return true;
                },
                verifyPasswords: function(input){
                    if (input.is("[name='PasswordConfirmation']")) {
                        return input.val() === $("#Password").val();
                    }
                    return true;
                }       
            },
            messages:{
                 passwordcomplexity: function(input) {
                     return setPasswordComplexityMessage(input);
                 },
                 verifyPasswords: "Passwords do not match."
            }
        });

[Stoyan]

Hi Jordan,

Currently I am building a sample that uses validation on keyup events of the inputs in the PopUp Editor for the Grid.

However I need some additional time finish it up and will share a detailed guide of the approach.

[Stoyan]

Hello Jordan,

To validate an input of the Grid's PopUp Editor:

1. Subscribe to the Edit Event of the Grid

   .Events(e=>e.Edit("onEdit"))

2. Use the content of the Edit Event handler to create a Validator in the PopUp's container
3. In the handler of the Edit Event subscribe to the keyup event of the desired input
4. Handle the keyup event and utilize the Validator's validate method to trigger validation.

   function onEdit(e){
         var validator = $(e.container).getKendoValidator();
         $("#ProductName").off().on("keyup",function(){
             validator.validate();
         })
    }

For your convenience I've applied these suggestions to a Telerik REPL sample.

Hopefully this approach is useful in the scenario at hand.

Regards,
Stoyan
Progress Telerik