I am using Angular 11 and 2020-Dec IG build.

My grid has a column of Name (string) and a column of Type (dropdown of static string-type choices). The validation of Name is based on Type and a regex that looks like this: /^PLAN\_[0-9]{4}\_[0-9]{2}[a-zA-Z0-9\_]{0,39}$/

"PLAN" is one of many prefixes that align with specific types and are not interchangeable.

What I need is a dynamically appearing warning about the Name not properly validating and prevention of submission by either click or enter keypress. I intend to have a warning snackbar floating in the upper right corner of the grid (zindex = 999), a warning span in the igxRowEditText area, and the "done" button in the igxRowEditActions area disabled until the Name matches the correct format.

I am finding that (onCellEdit) is not working for me, neither is (keypress) or (input) on my template for the column.

HTML template for Name and igxRowEditText:

        <ng-template igxRowEditText>
            <span class="error" *ngIf="badName">{{badNameWarning}}</span>
        </ng-template>

        <igx-column [pinned]="true" field="name" header="Scenario Name" [dataType]="'string'" [resizable]="true" width="246px" [sortable]="true">
            <ng-template igxCellEditor let-cell="cell">
                <igx-input-group>
                    <input igxInput [igxFocus]="true" name="ScenarioName" [(ngModel)]="cell.editValue" (keypress)="validateName(cell.editValue, cell.scenarioType)">
                </igx-input-group>
            </ng-template>
        </igx-column>

Handling in my Component:

  //validation
  badName:boolean = false;
  badNameWarning:string = '';

validateName(scenName:string, type:string) {
    let prefix:string = '';
    this.badName = false;
    if (type == 'Commit' && !/^PLAN\_[0-9]{4}\_[0-9]{2}[a-zA-Z0-9\_]{0,39}$/.test(scenName)) { this.badName = true, prefix = 'PLAN'; }
    ...else if (type == ...types
        this.badNameWarning = `${type} Name should be: ${prefix}_YYYY_WW(optional [a-z,A-Z,0-9,-,_] to 50 total)`;
 };