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
Set Focus on first cell of new row
posted

I am using an onGridKeydown event to add a new row of an igx-grid which is editable by the user.

The question I have is how can I set focus on the first cell of the new row when my onGridKeydown event fires?

Here is an example of my code.

public customKeydown(args: IGridKeydownEventArgs) {

const target: IgxGridCellComponent = args.target as IgxGridCellComponent;
const evt: KeyboardEvent = args.event as KeyboardEvent;
const type = args.targetType;

if (type === 'dataCell' && evt.key.toLowerCase() === 'arrowdown'{

const currentRowId = +this.grid1.data[this.grid1.data.length - 1].Id;
const newRowId = currentRowId + 1;

this.grid1.addRow({
Id: newRowId,
Code: '',
Currency: '',
Amount: null
});

this.grid1.updateRow({}, newRowId); // Sets focus on new row.

// Logic to set  focus on first cell......???

  }

}

Parents
No Data
Reply
  • 1080
    Offline posted

    Hello Jason,

    Thank you for posting in our community.

    My suggestion is to use the navigateTo method of igxGrid:

    //...
    this.grid1.navigateTo(newRowId, 0, (args) => { args.target.nativeElement.focus(); });
    //...

Children