The useful validationMessage parameter is totally undocumented for Model.define()

[Paolo]

We found that following features are totally undocumented , where <text> is a custom string :

1. options.fields.fieldName.validation.<attribute> = value; is generally passed-through like ad HTML attribute when kendo.ui.Editable is involved for editing corresponding model field <fieldName>
2. And so on options.fields.fieldName.validation.validationMessage  = "My custom message"; is generally passed-through like ad HTML attribute onto the corresponding INPUT dom element and it is very usefull when you need a custom validation message avoiding to deal with direct DOM manipulation
3. No document in your online KB mentions this behaviour associated to the Model.define() instead a KB page could be find related to the Validator https://docs.telerik.com/kendo-ui/controls/editors/validator/overview#application-of-custom-message-attributes , I think could save time to developers know that it is possibile and should be documented

Proofs in your code :

The CreateAttributes assembles object which contains the name:value pair from model field validation :

function createAttributes(options) {
    var field = (options.model.fields || options.model)[options.field], type = fieldType(field), validation = field ? field.validation : {}, ruleName, DATATYPE = kendo.attr('type'), BINDING = kendo.attr('bind'), rule, attr = {
        name: options.field,
        title: options.title
    };
    for (ruleName in validation) {
         // ruleName can contains a custom string that is not a validation rule

         // and rule will contain its value, for example validationMessage='MyMessage ....'

        rule = validation[ruleName];
        if (inArray(ruleName, specialRules) >= 0) {
            attr[DATATYPE] = ruleName;
        } else if (!isFunction(rule)) {
            attr[ruleName] = isPlainObject(rule) ? rule.value || ruleName : rule;
        }
        attr[kendo.attr(ruleName + '-msg')] = rule.message;
    }
    if (inArray(type, specialRules) >= 0) {
        attr[DATATYPE] = type;
    }
    attr[BINDING] = (type === 'boolean' ? 'checked:' : 'value:') + options.field;
    return attr;
}

 

The editor choosed by the kendo.ui.Editable sets DOM attributes via attr() and the previously assembled object

var editors = {
    'number': function (container, options) {
        var attr = createAttributes(options);
        $('<input type="text"/>').attr(attr).appendTo(container).kendoNumericTextBox({ format: options.format });
        $('<span ' + kendo.attr('for') + '="' + options.field + '" class="k-invalid-msg"/>').hide().appendTo(container);
    },
    'date': function (container, options) {
        var attr = createAttributes(options), format = options.format;
        if (format) {
            format = kendo._extractFormat(format);
        }
        attr[kendo.attr('format')] = format;
        $('<input type="text"/>').attr(attr).appendTo(container).kendoDatePicker({ format: options.format });
        $('<span ' + kendo.attr('for') + '="' + options.field + '" class="k-invalid-msg"/>').hide().appendTo(container);
    },
    'string': function (container, options) {
        var attr = createAttributes(options);
        $('<input type="text" class="k-input k-textbox"/>').attr(attr).appendTo(container);
    },
    'boolean': function (container, options) {
        var attr = createAttributes(options);
        $('<input type="checkbox" />').attr(attr).appendTo(container);
    },
    'values': function (container, options) {
        var attr = createAttributes(options);
        var items = kendo.stringify(convertItems(options.values));
        $('<select ' + kendo.attr('text-field') + '="text"' + kendo.attr('value-field') + '="value"' + kendo.attr('source') + '=\'' + (items ? items.replace(/\'/g, ''') : items) + '\'' + kendo.attr('role') + '="dropdownlist"/>').attr(attr).appendTo(container);
        $('<span ' + kendo.attr('for') + '="' + options.field + '" class="k-invalid-msg"/>').hide().appendTo(container);
    }
};

 

The validator  looks the ruleKey validationMessage directly on DOM element of a INPUT tag

var Validator = Widget.extend({
    // ...
    _extractMessage: function (input, ruleKey) {
        var that = this, customMessage = that.options.messages[ruleKey], fieldName = input.attr(NAME), nonDefaultMessage;
        if (!kendo.ui.Validator.prototype.options.messages[ruleKey]) {
            nonDefaultMessage = kendo.isFunction(customMessage) ? customMessage(input) : customMessage;
        }
        customMessage = kendo.isFunction(customMessage) ? customMessage(input) : customMessage;
        return kendo.format(input.attr(kendo.attr(ruleKey + '-msg')) || input.attr('validationMessage') || nonDefaultMessage || input.attr('title') || customMessage || '', fieldName, input.attr(ruleKey) || input.attr(kendo.attr(ruleKey)));
    }
    // ...
})

 

With this technique you can customize one validation message for a model field

 

[Veselin Tsvetanov]

Hi Paolo,

Thank you for your input on the Kendo Model.define() API reference.

You are right, that the described configuration is available, but not documented properly. Therefore, I have included the following task in our backlog.

As a small token of gratitude for helping us improve our documentation, I have updated your Telerik points.

In case you have any questions related to the Kendo widgets and their functionality, please do not hesitate to contact us.

Regards,
Veselin Tsvetanov
Progress Telerik

[Paolo]

Thanks !

I hope we can help making better kendo UI !