Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
30
IgxGrid Validate All Rows
posted

I'm working on an editable grid that the user can add rows to. I'm trying to validate that a newly added row doesn't already exist with the same values somewhere else in the grid. I have a row validator that checks all the rows and will put the new row into an error state if a duplicate is found.

The problem that I can't seem to find a solution for is if the user goes to the already existing row and makes changes to fix the error, the new row that was invalid cannot be revalidated to clear the error.

I tried to prevent leaving the new row by canceling the `rowEdit` event, but canceling removes the row entirely. It's odd.

Is there a way to have the grid run the validation for all rows and all cells?

Thank you.

Parents Reply
  • 2660
    Verified Answer
    Offline posted in reply to Joshua Hatton

    Hello Joshua,

    Thank you for following up.

    As documented in the Validation triggers section of the Grid Validation topic, validation is not triggered for cells/rows that are not edited via user input or via the editing API.

    Having this in mind, the sequence that you are describing can still be achieved by implementing additional logic in this direction. I modified the previous sample to demonstrate a possible approach when row editing is allowed and by leveraging the grid’s updateRow method.

    The initial invalid state could be “triggered” in the ngAfterViewInit hook:

      ngAfterViewInit(): void {
        this.data.forEach((entry) => {
          requestAnimationFrame(() => {
            this.grid.updateRow(entry, entry[this.grid.primaryKey]);
          });
        });
      }
     

    And for the described row editing scenario in order to retrigger validation for the other invalid records that no longer should have errors after the particular row edit is finished, the rowEditDone event could be leveraged, for example:

     public rowEditDone(event) {
        let recValidationState: IRecordValidationState[] =
          this.grid.validation.getInvalid();
        recValidationState.forEach((rv) => {
          rv.fields.forEach((f) => {
            if (f.errors && f.errors.duplicateValue) {
              let rowData = this.grid.getRowData(rv.key);
              requestAnimationFrame(() => {
                this.grid.updateRow(rowData, rowData[this.grid.primaryKey]);
              });
            }
          });
        });
      }
     

    Please, feel free to further modify this solution to fit your requirements. I hope it helps.

    Best regards,
    Bozhidara Pachilova
    Associate Software Developer

Children