I'm just starting to use Kendo UI and I'm having trouble getting one of the demos to work. I get Uncaught TypeError: Cannot read property 'observable' of undefined 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>
You must have a script that is not loading. My guess is that your pathing is wrong. Be aware that when your href
and src
start with ./
that means look for a subdirectory of the current directory. There is a good chance you don't want the dot there.
I was able to recreate your example successfully here: http://jsfiddle.net/95w1e3s3/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With