Dynamically added items to a DropDownList can not be unchecked

[Wojciech Wnuk]

Hi,

I'm creating a DropDownList with a datasource (json array) and grouping and selecting features.
It works great, but when i add an item dynamically (with a new group) DropDownList behaves strange. It doesn't add new grouping label and new item, when checked several times, is appended to the  text box in a box model layout several times, but when unchecked it doesn't disappear from text box.
Maybe i should add some code to refresh datasource, i looked for a solution but i can not find it :-(

Link to my code in javascript playground: http://jsplayground.syncfusion.com/r3gqhztw
I attached a zip file with a code and image illustrating a problem.

Thank you for your help.
Wojtek

Attachment: DropDownList_7680e020.zip

[Keerthana Rajendran]

Hi Wojciech, 

We analyzed your sample. 

Query : When checked several times, is appended to the  text box in a box model layout several times, but when unchecked it doesn't disappear from text box. 

Solution:  Field attributes should be same as what we mapped to fields properties when control initialize. i.e., you have mapped ‘id’ column to value field so the same column name should use in the object which is passed in addItem method.  

UG Link : https://help.syncfusion.com/js/api/ejdropdownlist#methods:additem 

Query:  When I add an item dynamically (with a new group) DropDownList behaves strange. It doesn't add new grouping label and new item 

Solution: We don’t have support for grouping or sorting in addItem method. If you require grouping you can manually push the new group with corresponding fields to the existing  array and bind that to the dataSource of dropdown via setModel as 

ddlobj.setModel({dataSource:jsonData}); 

We have prepared a sample for your reference. Please refer the below given sample link 

Sample: http://jsplayground.syncfusion.com/4w5h5ofo 

Note: When we bind data dynamically we will face issue with height of dropdown text box with multiselect mode. This issue has been fixed internally and this fix will be included in our Volume 2 SP2, 2016. So we have overridden the method _destroyBoxModel to overcome this issue in sample level. 

<code> 

ddlobj._dummydestroy = ddlobj._destroyBoxModel; 

  ddlobj._destroyBoxModel = function(e){ 

  ddlobj._dummydestroy.apply(this,e); 

                ddlobj._ulBox = null; 

} 

</code> 

Please let us know if any concern 

Regards, 

Keerthana. 

[Wojciech Wnuk]

Hi Keerthana,

Thank you for your help!
Of course, field attributes should be same as what I mapped to fields properties, I don't know how I could have missed that.
I suppose I've been too busy finding a solution in the internet and couldn't see the obvious :-)

Your solution to grouping problem is perfect. This is what I was looking for.
Thank you!

Best regards
Wojtek

[Keerthana Rajendran]

Hi Wojciech, 

 

Thank you for your update. Please contact us if you require further assistance on this. We will be happy to assist you 

 

Regards, 

Keerthana.