remove item from dropdownlist when source is an array with basic type

1 Answer 20 Views
Data Source DropDownList
Dan
Top achievements
Rank 1
Iron
Veteran
Dan asked on 01 Sep 2021, 06:10 AM

I have a dropdownlist with some years. The data source I am using directly an array of numbers eq: [2020, 2021]. I need to remove the 2020. When I am trying to call the method dropdownlist.dataSource.remove(dropdownlist.dataItem()) nothing happens

 

1 Answer, 1 is accepted

Sort by
0
Neli
Telerik team
answered on 03 Sep 2021, 01:18 PM

Hello Dan,

I am not sure about the exact scenario, however, there are different ways to remove or hide an element from the DropDownList. For example:

- You could remove the element from the array and then assign the modified array as DropDownList data

var data = [2020, 2021, 2022];    
data.splice(0, 1);

$("#dropdownlist").kendoDropDownList({
        dataSource: data,
        value: 2021
});

- You could set the needed dataSource using the setDataSource method. 

- You could hide the needed element when the DropDownList gets opened:

open: function(){
        setTimeout(function(){
              var ddl3 = $("#dropdownlist3").data('kendoDropDownList')
              $(ddl3.popup.element).find('li:eq(0)').hide()
       })
 }

Here is a Dojo example where all three approaches are demonstrated. 

I hope you will find the provided suggestions helpful for resolving the issue.

Regards,
Neli
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Dan
Top achievements
Rank 1
Iron
Veteran
commented on 03 Sep 2021, 01:33 PM

Hi Neli,

Since I presented the code dropdownlist.dataSource.remove(dropdownlist.dataItem()) then that means that I need to remove the selected item. So only using the method setDataSource() this can be achieved. Do I need to be aware of something? 

Does the two ways(manual and the api method) will accomplish the same thing from the point of performance and the events raised to the dropdownlist? (I mean if I use setDataSource(new_data) vs dataSource.remove(dropdownlist.dataItem())) 

 

 

Neli
Telerik team
commented on 08 Sep 2021, 12:12 PM

Hi Dan,

Using the remove method could be a better option as using setDataSource will refresh the entire DOM of the component. Just for your information below, you will find the links to the respective code for setDataSource and remove methods:

https://github.com/telerik/kendo-ui-core/blob/master/src/kendo.list.js#L1152

https://github.com/telerik/kendo-ui-core/blob/master/src/kendo.list.js#L2690-L2701

I hope this helps. 

Regards,

Neli

Tags
Data Source DropDownList
Asked by
Dan
Top achievements
Rank 1
Iron
Veteran
Answers by
Neli
Telerik team
Share this question
or