Validator stops displaying after .hideMessages called

4 posts, 1 answers
  1. Robert
    Robert avatar
    3 posts
    Member since:
    Jul 2012

    Posted 13 Jan Link to this post

    Hi

    We have a validator on our main view that works fine until we open a search modal.

    Just before the modal is hidden we do a hide messages. After returning focus to the main view the validator is still being run (can see in debug) but messages aren't displaying. Have a good trawl around but can't find anything relevant in Forums. 

    Would appreciate any suggestions?

    Commenting .hideMessages() out fixes issues but has undesirable user experience, hence it's addition...

    Thanks

    Rob

    // reset any validation warnings
    $("body").kendoValidator().data("kendoValidator").hideMessages();
             
    // close the modal
    $("#myModal").modal("hide");
        

  2. Robert
    Robert avatar
    3 posts
    Member since:
    Jul 2012

    Posted 13 Jan in reply to Robert Link to this post

    I found a work around on StackOverflow which seems to work...

    StackOverflow solution

    $(document.body).find("span.k-tooltip-validation").hide();

    instead of ...  

    $("body").kendoValidator().data("kendoValidator").hideMessages();

     

    By the way here is a cut down obfuscated example of our validator .js 

    $(function() {
        // document ready here
        // add the validation for input
        tpa.viewModel.validator = $("body").kendoValidator({
           validate: function(e) {
                
           },
            rules: {
                primaryName: function (input) {
                    if (input.is("[name=PrimaryName]") && input.is("[required=required]")) {
                        tpa.checkUniquePrimary(input.val());
                        return tpa.regEx("[a-zA-Z0-9]{1,40}", input.val());
                    }
                    return true;
                },
                arn: function(input) {
                    if (input.is("[name=SomethingElse]") && input.is("[required=required]")) {
                        return tpa.regEx("[0-9]{9}", input.val());
                    }
                    return true;
                },
                abn: function(input) {
                    if (input.is("[name=Abn]") && input.is("[required=required]")) {
                        return tpa.regEx("[0-9]{11}", input.val());
                    }
                    return true;
                },
                afsl: function(input) {
                    if (input.is("[name=SomeNumber]") && input.is("[required=required]")) {
                        return tpa.regEx("[0-9]{6}", input.val());
                    }
                    return true;
                },
                phone: function(input) {
                    if (input.is("[name=Phone]") && input.is("[required=required]")) {
                        return tpa.regEx("[0-9]{0,14}", input.val());
                    }
                    return true;
                },
                hasAlternatives: function (input) {
                    if (input.is("[name=AccessAllowed]")) {
                        if (input.val() === "2" && tpa.viewModel.model.alternatives.length < 1) {
                            return false;
                        }
                    }
                    return true;
                },
                effectiveTo: function (input) {
                    if (input.is("[name=EffectiveTo]")) {
                        var et = kendo.parseDate(tpa.viewModel.model.effectiveTo, "dd/MM/yyyy");
                        if (tpa.viewModel.model.TypeId !== 4 && et === null) {
                            return false;
                        }
                        var today = new Date();
                        today.setHours(0, 0, 0, 0);
                        if (tpa.viewModel.model.TypeId !== 4) {
                            var day = 24 * 60 * 60 * 1000;
                            if (tpa.viewModel.model.effectiveFrom instanceof Date) {
                                var future = new Date(tpa.viewModel.model.effectiveFrom.getTime() + (3 * 365 * day) + day);
                                return tpa.viewModel.model.effectiveTo >= today && tpa.viewModel.model.effectiveTo <= future;
                            }
                            else {
                                return tpa.viewModel.model.effectiveTo >= today;
                            }
                        } else {
                            if (et === null || et >= today) { // Gov/Trustee can be blank or future date.
                                return true;
                            } else {
                                return false;
                            }
                        }
                    }
                    return true;
                },
                effectiveFrom: function (input) {
                    if (input.is("[name=EffectiveFrom]")) {
                        var ef = kendo.parseDate(tpa.viewModel.model.effectiveFrom, "dd/MM/yyyy");
                        if (ef === null) {
                            return false;
                        }
                        var today = new Date();
                        today.setHours(0, 0, 0, 0);
                        return tpa.viewModel.model.effectiveFrom <= today;
                    }
                    return true;
                },
            },
            messages: {
                somethingelse: "SomethingElse must be 9 digits",
                abn: "ABN must be 11 digits",
                somenumber: "SomeNumber number must be 6 digits",
                phone: "Phone number must be max 14 digits, no dashes etc",
                hasAlternatives: "No alternatives specified. You must include at least one for that Access type",
                effectiveTo: "Expiry date is required. It must be future dated, no more than 3 years. Please confirm date is correct",
                effectiveFrom: "Effective date is in the future. Please confirm date is correct",
            }
        });

    But would love to know if this is a bug or we're just not using the .hideMessages() properly.

    Rob

     

     

  3. Kendo UI is VS 2017 Ready
  4. Answer
    Rosen
    Admin
    Rosen avatar
    3237 posts

    Posted 14 Jan Link to this post

    Hello Robert,

    The issue you have described is caused by instantiating a new Validator instance over the already existing one. The code in question:

    $("body").kendoValidator().data("kendoValidator").hideMessages();

    will first create a new Kendo Validator attached to the body element, then will retrieve the widget's instance and call its hideMessages method. Instead the code you be change to the following:

    $("body").data("kendoValidator").hideMessages();

    Note the missing kendoValidator call.

    Regards,
    Rosen
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  5. Robert
    Robert avatar
    3 posts
    Member since:
    Jul 2012

    Posted 14 Jan in reply to Rosen Link to this post

    Hi Rosen

    Thanks. That did the trick and makes perfect sense when you explained it.

    Cheers.

    Rob

Back to Top
Kendo UI is VS 2017 Ready