Combobox can not recycle popup by asynchronous method to get data

[wills]

Hi,

the combobox can not recycle popup by use asynchronous method to get data,

when  set  <ng-template #itemTemplate> in combobox.

Attachment: popup_5c4127f9.zip

[Ponmani Murugaiyan]

Hi wills,  

Thanks for contacting Syncfusion support. 

We have checked the reported query using the asynchronous to get data. It is working as expected in our end, please find the test sample below for reference.  

public onFiltering(args: any): void {  

    args.preventDefaultAction = true;  

    let query: Query = new Query();  

    query = args.text !== "" ? query.where("Game", "startswith", args.text, true) : query;  

    let data = this.dataService.fetch(args.text).subscribe(result => {  

      args.updateData(result, query);  

    });  

  }  

  

Sample: https://stackblitz.com/edit/angular-wwjr8b-zwk7zx?file=app.component.ts    

Kindly check with above sample meets your requirement. Please get back us if you need further assistance.  

Regards,  

Ponmani M 

[wills]

Hi wills,  

Thanks for contacting Syncfusion support. 

We have checked the reported query using the asynchronous to get data. It is working as expected in our end, please find the test sample below for reference.  

public onFiltering(args: any): void {  

    args.preventDefaultAction = true;  

    let query: Query = new Query();  

    query = args.text !== "" ? query.where("Game", "startswith", args.text, true) : query;  

    let data = this.dataService.fetch(args.text).subscribe(result => {  

      args.updateData(result, query);  

    });  

  }  

  

Sample: https://stackblitz.com/edit/angular-wwjr8b-zwk7zx?file=app.component.ts    

Kindly check with above sample meets your requirement. Please get back us if you need further assistance.  

Regards,  

Ponmani M 

Hi,

I checked your case and found out :

First:

     please used ejs-combobox  and itemTemplate to show popup

Run:

1. can get all data

2. Input a value to filter

3. clear the value ; and open popup

at this time, cannot show all data

Please Notice: be sure to use <ng-template #itemTemplate></ng-template>

anyway:

why the popup cannot recycled ,when I move the get data Method  from ngOninit() to onOpen()?

Attachment: Combobox_8a46de86.zip

[Ponmani Murugaiyan]

Hi Wills, 

Thanks for the detailed information. 

We have modified the sample as per the provided information. But unfortunately the issue is not replicated in our end. Please find the sample and video demonstration below for your reference. 

Modified sample: https://stackblitz.com/edit/angular-wwjr8b-oxtfbg?file=app.component.html  

Video demonstration: https://www.syncfusion.com/downloads/support/directtrac/general/ze/ScreenCapture_4-11-2020_6.43.09_PM.mp4-16221786  

 

Kindly check with the above video and sample. Please provide the issue replicating sample, which helps us to provide you the solution at earliest. 

Regards, 

Ponmani M 

[wills]

Hi Wills, 

Thanks for the detailed information. 

We have modified the sample as per the provided information. But unfortunately the issue is not replicated in our end. Please find the sample and video demonstration below for your reference. 

Modified sample: https://stackblitz.com/edit/angular-wwjr8b-oxtfbg?file=app.component.html  

Video demonstration: https://www.syncfusion.com/downloads/support/directtrac/general/ze/ScreenCapture_4-11-2020_6.43.09_PM.mp4-16221786  

 

Kindly check with the above video and sample. Please provide the issue replicating sample, which helps us to provide you the solution at earliest. 

Regards, 

Ponmani M 

Hi  Ponmani,

I found some error in your code: 

Please move ng-itemTemplate  in ejs-combobox ;

your code:

<div class="control-section">

  <div class="col-lg-8  content-wrapper" style="height: 350px">

    <div id='content' style="margin: 0 auto; width:250px; padding-top: 30px">

      <ejs-combobox #dropdownlistObj [dataSource]='itemTags | async' placeholder='Workshop.ITEM_GROUP'

        (filtering)="onFiltering($event)" (open)="onOpen($event)" [allowFiltering]='true'

        [filterType]="filterType" floatLabelType='Auto' [showClearButton]="true" [fields]='fields'>

      </ejs-combobox>

      <ng-template #itemTemplate let-itemTags>

        <span>{{itemTags.Games}}</span>

      </ng-template>

    </div>

  </div>

</div>

your need modify it like this:

<div class="control-section">

  <div class="col-lg-8  content-wrapper" style="height: 350px">

    <div id='content' style="margin: 0 auto; width:250px; padding-top: 30px">

      <ejs-combobox #dropdownlistObj [dataSource]='itemTags | async' placeholder='Workshop.ITEM_GROUP'

        (filtering)="onFiltering($event)" (open)="onOpen($event)" [allowFiltering]='true'

        [filterType]="filterType" floatLabelType='Auto' [showClearButton]="true" [fields]='fields'>

         <ng-template #itemTemplate let-itemTags>

          <span>{{itemTags.Games}}</span>

         </ng-template>

      </ejs-combobox>

    </div>

  </div>

</div>

[Ponmani Murugaiyan]

Hi Wills, 

Thanks for the detailed information. 

Query1: After clear the value ; and open popup at this time, cannot show all data 

 

We able to replicate the reported issue in our end. Currently we are validating, will check and update further details in 2 business days. In the meantime, can you please confirm the below issue reproducing sample and video demonstration for exact scenario of issue replication. 

Issue reproducing sample: https://stackblitz.com/edit/angular-wwjr8b-ga1rp6?file=app.component.html  

Video demonstration: https://www.syncfusion.com/downloads/support/directtrac/general/ze/ScreenCapture_5-11-2020_8.45.22_PM.mp4606167135  

Query2: Anyway:why the popup cannot recycled ,when I move the get data Method  from ngOninit() to onOpen()? 

 

We request you to share the use case scenario for using get data method in Open event. Based on that, we will check and update work-around solution or your requirement to resolve the reported issue. 

Regards, 

Ponmani M 

[wills]

Hi Wills, 

Thanks for the detailed information. 

Query1: After clear the value ; and open popup at this time, cannot show all data 

 

We able to replicate the reported issue in our end. Currently we are validating, will check and update further details in 2 business days. In the meantime, can you please confirm the below issue reproducing sample and video demonstration for exact scenario of issue replication. 

Issue reproducing sample: https://stackblitz.com/edit/angular-wwjr8b-ga1rp6?file=app.component.html  

Video demonstration: https://www.syncfusion.com/downloads/support/directtrac/general/ze/ScreenCapture_5-11-2020_8.45.22_PM.mp4606167135  

Query2: Anyway:why the popup cannot recycled ,when I move the get data Method  from ngOninit() to onOpen()? 

 

We request you to share the use case scenario for using get data method in Open event. Based on that, we will check and update work-around solution or your requirement to resolve the reported issue. 

Regards, 

Ponmani M 

hi  

Query2: Anyway: why the popup cannot recycled ,when I move the get data Method  from ngOninit() to onOpen()? 

 

We request you to share the use case scenario for using get data method in Open event. Based on that, we will check and update work-around solution or your requirement to resolve the reported issue. 

Answer:

>>>>Reason: I need use  this control to dynamic get data, when I open popup.

>>>>For Example: I have many combobox in one page, I don't want the controls to get data at ngOninit(), because maybe I just need use two or less controls for this time. If get all data, it will affect performance.

[Ponmani Murugaiyan]

Hi wills, 

Thanks for the update. 

Query1: After clear the value ; and open popup at this time, cannot show all data. 

 

We have confirmed the reported issue “After cleared the typed value, popup not shown the entire datasource with ng-template” as a bug in our end, the fix will be available in one of the upcoming patch release, which is expected to be rolled out on November 18, 2020. You can track the status of the bug in the below feedback link. 

Feedback: https://www.syncfusion.com/feedback/19529  

Query2: Anyway:why the popup cannot recycled ,when I move the get data Method  from ngOninit() to onOpen()? 

 

Based on the provided information, we suggest you to get data Method in created event of the ComboBox component to get rid of the reported issue. Please find the modified sample below for reference. 

 

Sample: https://stackblitz.com/edit/angular-wwjr8b-kyqsbv?file=app.component.ts  

Regards, 

Ponmani M