Kendo Grid Custom Validation Rules Not Working - validation

Question

I’m trying to use custom validation rules with a Kendo Web UI data grid but I haven’t been able to get it working. I’m able to attach a custom rule to the grid and it does get called when the user leaves the grid cell. The rule function also returns false to indicate that the input is not valid. But the error message is not displayed after deleting the name from a cell and then tabbing out. What am I missing?
JSFiddle: http://jsfiddle.net/davidsalahi/qMRBc/
var validatorRules = {
rules: {
// This rule is executed when leaving a cell but the return value of false doesn't display any error message or prevent leaving the cell
customRule1: function (input) {
// OpCode must not be empty
if (input.attr("name") == "ProductName") {
return $.trim(input.val()) !== "";
}
}
},
messages: {
customRule1: "All fields are required"
}
};

Answer 1

Create custom validation rule on your data source setting,
I have tried on your jsfiddle and worked correctly.
http://jsfiddle.net/pehlizm/qMRBc/4/
var crudServiceBaseUrl = "http://demos.telerik.com/kendo-ui/service",
dataSource = new kendo.data.DataSource({
transport: {
read: {
url: crudServiceBaseUrl + "/Products",
dataType: "jsonp"
},
parameterMap: function (options, operation) {
if (operation !== "read" && options.models) {
return {
models: kendo.stringify(options.models)
};
}
}
},
batch: true,
pageSize: 20,
schema: {
model: {
id: "ProductID",
fields: {
ProductID: {
editable: false,
nullable: true
},
ProductName: { //changes starts here
type: "string",
validation: {
custom: function(input) {
// set the custom message
input.attr("data-custom-msg", "Error");
if (input.attr("name") == "ProductName") {
return $.trim(input.val()) !== "";
}
}
}
}, //ends here
UnitPrice: {
type: "number",
validation: {
required: true,
min: 1
}
}
}
}
}
});