Search code examples
ag-gridag-grid-angularag-grid-validation

How to implement validation rules for ag-grid row edit


I currently have html table with inline editing that uses plain Angular Reactive Forms, including a lot of validation rules:

var formArray = new FormArray(this.items.map(createItemFormGroup));

createItemFormGroup(item){
   return new FormGroup({
        prop1: new FormControl(item.prop1, [Validators.required, Validators.min(1)])
        prop2:...
   })
}

Is there any example of how to integrate ag-grid with Angular validations? The requirement is, that I need to highlight invalid cell values. I don't necessarily need to use FormGroup…

I will probably use full row editing, so one way to go would be to create FormGroup only for row, that is being edited....


Solution

  • There are two ways of possible validation handling:

    First: via ValueSetter function

    and

    Second: via custom cellEditor component

    Example one

    Example two

    Async validation

    Extended validation