1. Home
  2. Forum
  3. Angular - EJ 2
  4. [ActionBegin event] Cancel searching event doesn't not work.

[ActionBegin event] Cancel searching event doesn't not work.

Hi there,

I have a data grid and I'm trying to implement a custom searching logic on it as below. But I figured out that "e.cancel = true" doesn't work properly. It did cancel the searching event for the first time but if I click the search button again for the second time without changing any searching value, it will trigger 'Refresh' event and the content of the grid has been changed.

private zcActionBegin(e): void {
console.log('Action Begin : (' + this.name + ') ' + e.requestType );
switch (e.requestType) {
case 'searching':
e.cancel = true;

// let service: object;
// this.MyService$.getMyData$({
// searchCriteria : e.searchString
// }).subscribe(
// result => {
// if (result != null) {
// console.log('Searching ' + result)
// this.zcGrid.dataSource = result;
// }
// }
// )
break;
case 'refresh':
console.log(e)
break;
}
}
private zcActionComplete(e): void {
console.log('Action Complete : (' + this.name + ') ' + e.requestType );
switch (e.requestType) {
case 'searching':
console.log(e.searchString)
break;
case 'refresh' :
     console.log(e)
break;
}
}





5 Replies
PK Prasanna Kumar Viswanathan Syncfusion Team August 27, 2018 07:06 AM UTC

Hi Nelson, 

Thanks for contacting Syncfusion support. 

Based on your query we understand that the e.cancel = “true” is not working fine when you click on the search button for the second time without changing any searching value . So, we have prepared a sample using your code example, but we are not able to reproduce the reported issue at our end. 

Refer the below link for the sample.  


Kindly share the following details to reproduce the reported issue at our end. 

1. Share the full grid rendering code. 

2. Share the Essential studio version. 
3. Ensure whether any script error in console page when you click on search button for the second time. If yes, share the stackrace and screenshot of an error. 
4. Have you used any adaptors(URL, remoteSave, WebAPI) in Grid?  
5. If possible try to reproduce the reported issue in provided sample.  
Regards, 
Prasanna Kumar N.S.V 

NT Nelson Tang August 27, 2018 03:32 PM UTC

Hi there, 

You need to change the data source value in order to reproduce the reported issue. For example, you can create a button to change the data source value at run-time and then the grid supposed to call 'Refresh' event. After that, you will see the problem after clicking the search button for the second time without changing any value. Hereby attached with the sample source code.

Attachment: TestGridSourceCode_b4aae67e.7z

VA Venkatesh Ayothi Raman Syncfusion Team August 29, 2018 10:27 AM UTC

Hi Nelson, 
 
Thanks for the update. 

We have checked your query and by default, if the Search Key value is same, Grid will not execute the searching action again. It simply calls the Grid refresh. This is the default behavior of Essential JavaScript 2 Grid component. So, we suggest you to clear the searching after changing the dataSource property. So the ‘actionBegin’ event for searching will be triggered. Please refer to the below code example and sample link. 
 
[component.ts] 
@Component({ 
  selector: 'app-root', 
  template: `<ejs-grid #grid [dataSource]='data' [allowPaging]="true" [allowSorting]="true" 
  [allowFiltering]="true" [pageSettings]='pageSettings' (actionBegin)="zcActionBegin($event)" 
    (actionComplete)="zcActionComplete($event)" [toolbar]='toolbar'> 
                <e-columns> 
                 .   .   . 
                </e-columns> 
                </ejs-grid> 
                <input type="button" value="Change Grid Value" (click)='testGridOnClick($event)'>` 
}) 
export class AppComponent implements OnInit { 
       .  .  . 

  private testGridOnClick(e) { 
    debugger 
    this.data = [ 
                           .  .  .  
                          ]; 
    this.grid.search(''); // resets the searching 
  } 

  private zcActionBegin(e): void { 
    console.log('Action Begin' + e.requestType); 
    switch (e.requestType) { 
      case 'searching': 
        e.cancel = true; 
        break; 
      case 'refresh': 
        console.log(e); 
        break; 
    } 
  } 
} 


Please let us know if you have any further assistance on this. 
 
Regards, 
Venkatesh Ayothiraman. 


NT Nelson Tang August 29, 2018 03:37 PM UTC

No.. That's not right, the problem still persists. Remember, searching action become abnormal after changing the data source. The refresh action should not trigger. Please check the print screen below.



VA Venkatesh Ayothi Raman Syncfusion Team August 30, 2018 12:13 PM UTC

Hi Nelson, 

Thanks for the update. 

In Essential JavaScript 2 Grid component If the search key is same after any action like data binding, Editing etc. then Grid will not trigger the search action again. It will just refresh the Grid. This is the default behavior of the Grid component. However, you can reset the search key value after updating the DataSource property as stated in our previous update. Please let us know if you have any concern. 


Regards, 
Venkatesh Ayothiraman. 


Loader.
Up arrow icon