I'm just starting to use the Kendo user interface, and I'm having problems getting one of the demos to work. I get Uncaught TypeError: Can't read the observable undefined property on line 43. How can I fix this? Any help is appreciated.
<!DOCTYPE html> <html> <head> <title></title> <link href="./styles/kendo.common.min.css" rel="stylesheet" /> <script src="./js/jquery.min.js"></script> <script src="./js/angular.min.js"></script> <script src="./js/kendo.core.min.js"></script> </head> <body> <div id="example"> <div class="demo-section k-header"> <div class="box-col" style="width: 300px"> <h4>Change the value</h4> <input data-role="slider" data-min="0" data-max="50" data-small-step="5" data-large-step="10" data-bind="visible: isVisible, enabled: isEnabled, value: selectedNumber, events: { change: onChange }" style="width: 180px"> </div> <div class="box-col console-section"> <h4>Console</h4> <div class="console"></div> </div> </div> <div class="box"> <div class="box-col" style="width: 300px"> <h4>Configuration</h4> <div> <label><input type="checkbox" data-bind="checked: isEnabled">Enable</label> </div> <div> <label><input type="checkbox" data-bind="checked: isVisible">Visible</label> </div> </div> </div> <script> var viewModel = kendo.observable({ selectedNumber: 0, isEnabled: true, isVisible: true, onChange: function() { kendoConsole.log("event :: change (" + this.get("selectedNumber") + ")"); } }); kendo.bind($("#example"), viewModel); </script> </div> </body> </html>
source share