Search code examples
angularjskendo-uiangular-kendokendo-ui-gridkendo-validator

How to implement Kendo UI Custom validator on grid level


I have a Kendo UI Grid with is configured for batch editing. What I wish to achieve is a grid level custom validation before the grid's CRUD functions are invoked. So assuming the grid displays a list of employees, and user adds two employees with the same EmployeeID; then on clicking 'Save Changes', the grid should invoke the custom validator rules(say we have a one rule to check whether all the employee id's are unique). Based on the validation result, the grid should decide whether to invoke it's create/update/destroy functions.

I would greatly appreciate if someone can respond to my concern.

My Kendo Grid:

<div id="allocGrid" kendo-validator="ctrl.allocationGridValidatorRules" kendo-grid k-options="ctrl.allocationGridOptions(dataItem)"></div>

Validation Rules:

ctrl.allocationGridValidatorRules = {
        rules: {
            customRule1: function (input) {
                // this rule may check if all the employee Id's in the grid are unique
            }
        },
        messages: {
            customRule1: "Enter a unique Employee Id"
        }
    };

I was referring to the below links:

http://jsfiddle.net/davidsalahi/qMRBc/

http://demos.telerik.com/kendo-ui/validator/angular


Solution

  • If you are doing batch edit and u want to check for duplicates I suggest you to use saveChanges event where u can do your check on e.sender.dataSource and stop saving changes if needed

    saveChanges: function(e) {
        if (!confirm("Are you sure you want to save all changes?")) {
           e.preventDefault(); 
        }