Knockout-Kendo cascading dropdownlists

0
votes

I have modified the Shopping cart Knockout example (http://knockoutjs.com/examples/cartEditor.html) to use the KendoUI DropDownLists, via the Knockout-Kendo.js library.

As shown in this jsfiddle, this is not working as expected (the second DropDownList is not populated, and appears as a standard input) . http://jsfiddle.net/L3F2Y/4/

When running this on my machine, the following javascript error is thrown:

Microsoft JScript runtime error: Unable to parse bindings. Message: ReferenceError: 'products' is undefined; Bindings value: kendoDropDownList: { dataTextField: 'name', data: products, value: $parent.product }

I presume that this is happening due to the way that the Knockout-Kendo custom binding processes the collections, but any further attempts to understand/resolve this problem have been unsuccessful.

Thanks in advance!

1
knockout.jskendo-ui

1 Answers

1
votes

The Kendo DropDownList is not setup to track selected objects natively. It wants to populate the value with a primitive. So, it will end up just doing a .toString() on an object.

You would need to track the name of the category and the name of the product separately and create computed observables to keep a copy of the related object.

Here is a sample: http://jsfiddle.net/rniemeyer/e3cTT/