Common Save Button

Thread ID:	Created:	Updated:	Platform:	Replies:
146909	Aug 25,2019 03:48 PM UTC	Aug 27,2019 07:26 AM UTC	Angular - EJ 2	1

Subscribe to this post

Tags: Grid

Sagar

Asked On August 25, 2019 03:48 PM UTC

Hi,

I have three grid on same page.

Want to create custom one save button for these three grids for batch save?

and also how to keep only add, delete button for these grids in batch edit mode?

Reply | Reply with quote

Rajapandiyan Settu [Syncfusion]

Replied On August 27, 2019 07:26 AM UTC

Hi Sagar,

Thanks for contacting us.

Query 1: Want to create custom one save button for these three grids for batch save?

You can achieve your requirement by using `batchSave` method in the grid. In the below sample we have used `batchSave` method to save the edited and deleted records in three grids by button click event.

Query 2: how to keep only add, delete button for these grids in batch edit mode?

We suggest you to keep `Add`, `Delete` Items only in the toolbar to achieve your requirement. please refer the below code and sample for more information.

Component.ts

import { Component, OnInit,ViewChild } from '@angular/core';

import { orderData } from './data';

import { EditService, ToolbarService, PageService,GridComponent } from '@syncfusion/ej2-angular-grids';

@Component({

selector: 'app-root',

templateUrl: 'app.component.html',

providers: [ToolbarService, EditService, PageService]

})

export class AppComponent {

public data: Object[];

public editSettings: Object;

public toolbar: string[],

public pageSettings: Object;

@ViewChild("Batchgrid1",{static:true})

public grid1:GridComponent;

@ViewChild("Batchgrid2",{static:true})

public grid2:GridComponent;

@ViewChild("Batchgrid3",{static:true})

public grid3:GridComponent;

public ngOnInit(): void {

this.data = orderData;

this.editSettings = { allowEditing: true, allowAdding: true, allowDeleting: true, mode: 'Batch' };

this.toolbar = ['Add', 'Delete'];

this.pageSettings = {pageCount: 5};

}

public Save():void{

this.grid1.editModule.batchSave();

this.grid2.editModule.batchSave();

this.grid3.editModule.batchSave();

}

Sample: https://stackblitz.com/edit/angular-1efxsy?file=app.component.html

documentation: https://ej2.syncfusion.com/documentation/api/grid/edit/#batchsave

Please get back to us, if you need further assistance.

Regards,

Rajapandiyan S.

Reply | Reply with quote

Common Save Button

Thread ID:

Created:

Updated:

Platform:

Replies:

Please sign in to access our forum

CONTACT US