Knockout validationis not updating error message according to the validation specification

Question

I am trying to show different validation messages based on a provided condition, but the messages are not displayed properly. All methods used in this function are working fine as per requirement.

I am attaching the code:

self.pickupCloseTime.extend({
    required: {
        message: "Please select Close time.",
    },
    validation: {
        validator: function (val) {
            if (val == "") {
                this.message = "Please select Close time.";
                return false;
            }
            else if (self.pickupReadyTime() != "") {
                var readyTime = moment(self.pickupReadyTime(), "hh:mm A");
                var closeTime = moment(val, "hh:mm A");

                if (closeTime.diff(readyTime) > 0 
                      && (closeTime.diff(readyTime) / 3600) < 2000) {
                    this.message = 'Please select valid Close time.';
                    return false;
                }
                else if (closeTime.diff(readyTime) <= 0) {
                  this.message = "Close time should be greater than Ready time.";
                  return false;
                }
                return true;
            }
            else {
                this.message = 'Please select Ready Time first.'
                return false;
            }
        },
        message: "Close time should be greater than Ready time.",
        params: true
    }
});

Please help.

Answer 1

Best practise is to split them into smaller validation cases, each with its own condition and message.

You can also add them as custom validation rules to be reused, and here is an example:

define(['knockout',
    'data/settings',
    'services/resourceService'],
function (ko, settings, resourceService) {

    ko.validation.rules['closeTimeNotValid'] = {
        // check if close time is Valid
        validator: function (val) {
            //example rule
            return val != "" && val > 0;
        },
        message: "Please select valid Close time."
    };
            return ko.validation.rules;
});

Then you can use/reuse this rule if needed:

self.pickupCloseTime.extend({
    required: {
        message: "Please select Close time."
    },
    closeTimeNotValid: {
        message: "Message overrides the custom rule's message",
        //add more rules/conditions to the main one, you can also 
        //set params here to be used in the custom validation
        onlyIf: function () { return self.someOtherField(); }
    }
});