Cannot completely bind DataSource to ListBox via MVVM

[Grant]

Hi Team, 

As my question says, Im having trouble with a DataSource bound to a ListBox. Take a look at my Dojo here, https://dojo.telerik.com/ipIfAROK.
I have bound a DS to the listbox, and it displays the DS content, great. The content is (suppose to be) linked to the enabled state of the ActionButton, no content = disabled button. however if i removed the listbox items, the button remains enabled.

To Replicate:
1) Click the "Log List" button and check your console, there are 2 items in the viewModel DS
2) Remove them and click the Log button again. There are STILL 2 items in the DS, but they've been removed from the listbox.

Please advise on how i can link the enabed state of a button to the content of the list box, preferably using the View Model. I hope this isnt something simple I've missed.

THanks,
Grant

[Georgi]

Hi Grant,

The ListBox will actually create its own dataSource using the options of the dataSource in the view model. In other words, when you remove an item from the listbox, the widget will remove it from its own dataSource. To achieve the described behavior I would suggest you to add a separate field in the view model which tracks the count of the data and update it when an item is removed.

Below you will find a modified version of the provided sample:

• https://dojo.telerik.com/IpIWEgix

Regards,
Georgi
Progress Telerik

[Grant]

Hi Georgi, 

Thanks for getting back to me with a solution, but it raises another question. Why does the ListBox create its own dataSource instead of using the one I want to bind to it? Other widgets like comboxes and dropdownlists that use <select> bind fine to an MVVM database.

Why is the listbox different?

Thanks, 

Grant

[Georgi]

Hello Grant,

Indeed the behavior is not consistent between the components and I will discuss with my colleagues unifying the initialization from select element.

Another option would be to call kendo.notify after initializing the widget, which will bind the listbox to the dataSource of the view model.

e.g.

          var list =  $("#optional").kendoListBox({
            dataTextField:'text',
            dataValueField:'value',
            toolbar: {
              tools: ["remove"] 
            }
          }).data('kendoListBox');
          kendo.notify(list)    

Below you will find a sample:

• https://dojo.telerik.com/ipIfAROK/11

 

Regards,
Georgi
Progress Telerik

[Grant]

Thanks Georgi, 

Thats the perfect solution. Where is the API for kendo.notify(), I cannot find it under https://docs.telerik.com/kendo-ui/api/javascript/kendo

Thanks again,
Grant

[Georgi]

Hi Grant,

The kendo.notify is an internal method which purpose is to notify the binder that a widget has been initialized. As it is meant to be used only internally we have not documented it.

Regards,
Georgi
Progress Telerik