GRID Add button navigate to my custom route

Question

Hi Team,I write Angular application and I use grid of Syncfusion. Syncfusion grid have great functionality. But I don't know how can I implement toolbar settings with custom Add button.For example.I add add button, and add button have default functionality, I want override that.When I click add button on grid I want that navigate to my component.(*/something/add)Could I do that with grid?

tony · Answer

This worked for me

this.toolbarOptions = [{text: 'Add User', prefixIcon: 'e-btn-icon e-add e-icons e-icon-left'}, 'Search'];

toolbarClick(args: ClickEventArgs): void {

if (args.item.text === 'Add User') {

this.router.navigate(['profile'], { relativeTo: this.activatedRoute});

}

args.cancel = true;

}

Mohammed Farook J · Answer

Hi Marko, 
 
Thanks for contacting Syncfusion support. 
 
Yes, you can add the customer toolbar item by using ‘Toolbar-template’ and you can handle the customer toolbar item functionality by using ‘toolbarClick’ event. Please find the documentation for your reference. 
 
Documentation : https://ej2.syncfusion.com/angular/documentation/grid/tool-bar.html#custom-toolbar-items  
 
Regards, 
J Mohammed Farook