"Maximum call stack size exceeded at extend (ej2-base.es2015.js:154)" error is throw by DropDownList control in described scenario

Hi Team,

I have a scenario where the binded value as well as data source list of DropDownList control is changed by the code internally on change of values of other controls.

There is an issue in which if allowFiltering is set as true in DropDownList control and its binded value or datasource list change after user has focussed into the control and dropdown is opened, it throws following error in console "Maximum call stack size exceeded at extend (ej2-base.es2015.js:154)".

The control can no more be used unless page is refreshed.

I have tried to reproduce the same exception in the demo project  attched using a timer. However in real scenario, values are changed when server results are received.
To get error in demo project, tab into the DropDownList control.

Could you please provide some solution to this?
As a workaround I can introduce a delay in opening dropdown but that wont't solve the problem as server might respond late in case of slow connections.

Thanks
Tuariq

Attachment: MaxCallStackErrorZip_8fe2a3f7.zip

1 Reply

SP Sureshkumar P Syncfusion Team April 28, 2020 11:39 AM UTC

Hi Tuariq, 
 
Greetings from Syncfusion support.  
 
Based on your shared information with code example, we suspect that you want to change the datasource and preselected values dynamically to the component. When you update the datasource and value in the open event. That will be looping the list generation procedure in open event. That is the reason you have facing the issue.  We suggest you process the dynamic value update in focus event instead of open event to resolve the issue.  
 
Kindly refer the below code example 
 focus(){ 
    if(this.val === 'Badminton'){       
    this.dd.value = null; 
    // call databind for update the component value  
    this.dd.dataBind(); 
    } 
    this.data = ['New Badminton']; 
    // call databind for update the component datasource  
    this.dd.dataBind(); 
    this.val = 'New Badminton'; 
    // call databind for update the component value  
    this.dd.dataBind(); 
  } 
 
 
 
please check the above code example and let us know whether it suits your requirement. if not please get revert us with details. 
 
Regards, 
Sureshkumar P 


Loader.
Up arrow icon