Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Kendo UI kendo is undefined

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>
like image 318
Chromey Avatar asked Nov 11 '22 03:11

Chromey


1 Answers

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/

like image 152
Dave Avatar answered Nov 14 '22 22:11

Dave