Currently I'm develop hierarchy char by using Kendo UI Treelist feature. Below is my snipe code
in my .aspx file "
I include those scripting in header
<script type="text/javascript" src="../Scripts/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="../Scripts/kendo/kendo.all.min.js"></script>
in my javascript (datasource is i load from my own data)
var wbsDataSource =
[{
ID: "1",
Description: "Kick Off",
Parent: null
}, {
ID: "2",
Description: "Meeting",
Parent: "1"
}
]
var dataSource = new kendo.data.TreeListDataSource({
data: wbsDataSource,
schema: {
model: {
id: "ID",
parentId: "Parent",
fields: {
Parent: {
field: "Parent",
nullable: true
},
ID: {
field: "ID",
type: "number"
}
},
expanded: true
}
}
});
$("#treelist").kendoTreeList({
dataSource: dataSource,
height: 800,
editable: {
move: {
reorderable: true
}
},
columns: [{
field: "Description",
title: "Description",
width: 280,
}
]
});
however when i run the code above it throw me error "Uncaught TypeError: $(...).kendoTreeList is not a function"
it will only work when I change my html header into code below (JavaScript remain the same), especially with using the base HREF
<base href="https://demos.telerik.com/kendo-ui/treelist/dragdrop">
<style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2022.3.1109/styles/kendo.default-ocean-blue.min.css" />
<script src="https://kendo.cdn.telerik.com/2023.1.117/js/jquery.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2023.1.117/js/kendo.all.min.js"></script>