We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Rerender ComboBox data (set dataSource to empty)


I am trying to set comboBox dataSource to empty array but I am still can see data that was rendered before my changes.

What am I doing:
On load I want to see one data in my comboBox. After value change in different comboBox I want to rerender data. Some times in cat be rerender to empty comboBox. I am doing in like this:
<ejs-combobox #ComboBox {someProperties}></ejs-combobox>
@ViewChild('ComboBox') MyComboBox: ComboBox;
public setDataSource() {
     if (this.data.length < 0)
          this.MyComboBox.dataSource = [];
          this.MyComboBox.dataSource = this.data;

If I set my dataSource to empty array - I see previuosly set values. If I set dataSource to some data - I see correct data. Maybe I am doing something wrong and must delete dataSource in some different way?

This is what data I am getting after setting dataSource to empty:

P.S. I am getting my data from WebAPI. I am using ej2-angular-dropdows version 17.1.49

6 Replies

SN Sevvandhi Nagulan Syncfusion Team January 21, 2020 06:44 PM UTC

Hi AC, 

Greeting from Syncfusion support. 

We can able to reproduce the reported issue in our end. The cause of the issue is ulElement not updated property. You can set the value null to ulElement and list as mentioned in the below code snippet, 

        this.localObj.dataSource = []; 
        (this.localObj as any).ulElement = null; 
        (this.localObj as any).list = null; 

Please find the sample below, 

Sevvandhi N 

UN Unknown Syncfusion Team January 23, 2020 04:52 AM UTC


thank you for your answer. It works almost perfect but in some cases if I set my dataSource ant other stuff like in your example after using combobox destroy event I am getting an error (it looks like it is trying to hide popup event if it was not opened):

UN Unknown Syncfusion Team January 23, 2020 05:09 AM UTC

I fixed this issue by also setting listData property to null:
(this.localObj as any).listData = null;

SP Sureshkumar P Syncfusion Team January 24, 2020 06:36 AM UTC

Hi AC, 
Sureshkumar P 

TH Thashwin August 24, 2022 02:24 PM UTC

Can you please provide a similar solution for ASP .net core

UD UdhayaKumar Duraisamy Syncfusion Team August 25, 2022 12:34 PM UTC

Hi Thashwin,

We have recreated the sample in the ASP.NET core platform and shared the sample link below for reference. Please refer to the code snippet and sample for more details.

<ejs-combobox id="games" placeholder="Select a game" popupHeight="220px">


<hr />


<button onclick="LoadData()">Load Data</button>

<button onclick="RemoveData()">Remove Data</button>




    function LoadData()


        document.getElementById('games').ej2_instances[0].dataSource = ['a','b','c'];


    function RemoveData()


        document.getElementById('games').ej2_instances[0].dataSource = [];



Sample : https://www.syncfusion.com/downloads/support/directtrac/general/ze/CoreDynamicDataSource-245412455

Kindly try the above sample and let us know if this meets your requirement.

If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.


Udhaya Kumar D

Live Chat Icon For mobile
Up arrow icon