Grid Add Issue

[License Admin]

Hi,

I am validating something from backend so in response i am getting error then too in that grid it is displaying that newly added line so how i can avoid it that if error is coming then it should not show that grid line in grid?

[Pavithra Subramaniyam]

Hi Sandeep, 

 

Thanks for contacting Syncfusion support. 

 

You can skip the add action based on validation result by setting the cancel as true in the actionComplete event. Please refer to the below code example, documentation link and sample link for more information. 

 

[index.jsx] 

export class NormalEdit extends SampleBase { 

    

    actionBegin(args) { 

         // works for add action. if you wan tto validate on both edit and add, remove the condition for args.action 

        if (args.requestType === 'save' && args.action == "add" ) { 

          if(args.data.OrderID == 1){  // here you do server validation and based on that enable "cancel"  

            args.cancel = true; 

          // if you want to stay in edit state you can remove the below line 

            this.gridInstance.closeEdit(); 

          } 

        } 

    } 

    render() { 

        return (<div className='control-pane'> 

          <GridComponent dataSource={orderDataSource} ref={grid => this.gridInstance = grid} toolbar={this.toolbarOptions} allowPaging={true}  

                                           editSettings={this.editSettings} pageSettings={this.pageSettings} actionBegin={this.actionBegin.bind(this)}> 

              <ColumnsDirective> 

                .  .  . 

              </ColumnsDirective> 

              <Inject services={[Page, Toolbar, Edit]}/> 

            </GridComponent> 

        </div>); 

    } 

} 

 

render(<NormalEdit />, document.getElementById('sample')); 

 

Documentation: https://ej2.syncfusion.com/react/documentation/api/grid/#actioncomplete 

                            https://ej2.syncfusion.com/react/documentation/api/grid/#closeedit 

 

Sample               : https://stackblitz.com/edit/react-6hppqp-mru6ip?file=index.js 

 

Please get back to us if you need any further assistance on this. 

 

Regards, 

Pavithra S.