When using the [changeDataSource] method multiple times in a short period of time to modify a column, the filtering function fails.

  1. Add printing information in the [updateColumns], [actionBegin], [actionComplete] methods; Call [changeDataSource] in [updateColumns] to modify the column and reset the [FilteringSetting] .
  2. Click the [start Change] button and the [changeDataSource] method will be executed 10 times at 10ms intervals.
  Image_1614_1708676315199

Check print results:

The normal result should be: [updateColumns --> x] --> [actionBegin-filtering --> x] --> [actionComplete-filtering --> x]

But the print result shows: [updateColumns --> x] --> [actionBegin-filtering --> x] -->[updateColumns --> Y] --> [actionComplete-filtering --> x]

[updateColumns --> Y] was executed before [actionComplete-filtering --> x]

In the normal order: the [FilteringSetting ] will be reset in the [updateColumns] method, and the data will be filtered according to the  [FilteringSetting ] in the [actionComplete] method.

When the error process is executed, [updateColumns --> x] sets the [FilteringSetting ] . While waiting for [actionComplete-filtering --> x] to execute, [updateColumns --> Y] resets the [FilteringSetting ] again; resulting in [actionComplete -filtering --> x] The [FilteringSetting ] may be wrong when starting execution.


Example:https://stackblitz.com/edit/angular-ba3qeo-c1vqrm?file=src%2Fapp.component.ts,src%2Fapp.component.html



3 Replies

VK Vasanthakumar K Syncfusion Team February 27, 2024 08:33 AM UTC

Hi wills,


Greetings from Syncfusion support


We have validated your query and understand that you are facing an issue with updating columns dynamically within a short interval of time using the "changeDataSource" API method. During validation, we found that another action is triggered within the while loop before the filtering action is complete. This needs to be handled at the application level by using a local Boolean variable condition-based looping. Upon completion of the action, continue the loop to resolve the issue. We have modified the provided sample for your reference. You can refer to the sample and code example below for more details.


[code example]

export class AppComponent {

  private isActionComplete = true; // local variable for detect dynamic filter action completion.

  . . . . . .

  async dowile() {

    while (this._FieldSeq < 10 && this.isActionComplete) {

      await this.timeLoop();

      this.onclick();

    }

  }

  updateColumns(columns: any[]) {

    this._uSeq++;

    this.grid!.changeDataSource(undefined, columns);

    console.log('updateColumns --> ' + this._uSeq);

    this.isActionComplete = false;

    this.setFilterList();

  }

  actionComplete(e) {

    this._completeSeq++;

    console.log(e.name + '-' + e.requestType + ' --> ' + this._completeSeq);

    this.isActionComplete = true;

    this.dowile();

  }

}



Modified sample: 186885-short-interval-update - StackBlitz


Regards,

Vasanthakumar K



TE techlandandyzhang February 29, 2024 09:27 AM UTC

The examples I provided above are mainly to illustrate the issues we encountered when using changeDataSource. Occasionally, we see incorrect property values in the properties attribute of FilterSetting. This only happens when the filters triggered by the actionComplete event from changeDataSource are still in progress. In many scenarios, it is not feasible for us to wait until the filters triggered by actionComplete are completed before calling changeDataSource.

  • Is there a way to destroy all events listening to filters after changeDataSource occurs?

  • Or can calling changeDataSource retain the previous FilterSetting?



VK Vasanthakumar K Syncfusion Team March 5, 2024 08:52 AM UTC

Hi techlandandyzhang,


We have validated your query and understand that the provided solution is that "changeDataSource()" needs to wait until the previous filter action is complete. However, in your case, it is not feasible to wait until the grid's filter action is complete. All manual customizations related with application need to be handled at the application level only based on application requirements. From your last provided sample, it seems that you are updating the same filter settings on every loop, but instead of doing so after the loop ends, you can set the filter settings. We need to know the reason for updating filter properties dynamically after "changeDataSource()" is called manually. Therefore, before providing a solution, we need clarity on your customization and requirement. Kindly provide the following details to assist us:


1) Share your complete grid rendering customization code.


2) Please share the use case of your customization scenario or explain the application requirement through a video demonstration.


3) Please confirm if our understanding of the query is correct. If not, please share a detailed explanation of your query or provide a video demonstration.


4) Based on the provided sample, we understood that you are using local data, if not, please share data binding details with adaptor type.


5) Based on the provided sample, we understood that you are using the latest Syncfusion package, if not, please provide Syncfusion package details.


Regards,

Vasanthakumar K


Loader.
Up arrow icon