Files
2022-11-04 13:24:24 +02:00

122 lines
4.5 KiB
HTML
Executable File

<!DOCTYPE html>
<html>
<head>
<title>Localization</title>
<meta charset="utf-8">
<link href="../content/shared/styles/examples-offline.css" rel="stylesheet">
<link href="../../styles/kendo.common.min.css" rel="stylesheet">
<link href="../../styles/kendo.rtl.min.css" rel="stylesheet">
<link href="../../styles/kendo.default.min.css" rel="stylesheet">
<link href="../../styles/kendo.default.mobile.min.css" rel="stylesheet">
<script src="../../js/jquery.min.js"></script>
<script src="../../js/jszip.min.js"></script>
<script src="../../js/kendo.all.min.js"></script>
<script src="../content/shared/js/console.js"></script>
<script>
</script>
</head>
<body>
<a class="offline-button" href="../index.html">Back</a>
<div id="example">
<div class="box wide">
<label for="language">Choose language:</label>
<input id="language" value="en-US" />
</div>
<div id="treelist"></div>
<script>
var crudServiceBaseUrl = "https://demos.telerik.com/kendo-ui/service";
var dataSource = new kendo.data.TreeListDataSource({
transport: {
read: {
url: crudServiceBaseUrl + "/EmployeeDirectory",
dataType: "jsonp"
},
update: {
url: crudServiceBaseUrl + "/EmployeeDirectory/Update",
dataType: "jsonp"
},
destroy: {
url: crudServiceBaseUrl + "/EmployeeDirectory/Destroy",
dataType: "jsonp"
},
create: {
url: crudServiceBaseUrl + "/EmployeeDirectory/Create",
dataType: "jsonp"
}
},
schema: {
model: {
id: "EmployeeId",
parentId: "ReportsTo",
fields: {
EmployeeId: { type: "number", nullable: false },
ReportsTo: { field: "ReportsTo", nullable: true }
}
}
}
});
function changeLanguage() {
kendo.ui.progress($("#treelist"), true);
var baseUrl = '@Url.Script("messages/kendo.messages.", false)';
$.getScript(baseUrl + this.value() + ".min.js", function () {
kendo.ui.progress($("#treelist"), false);
createTreeList();
});
}
function createTreeList() {
var element = $("#treelist");
if (element.data("kendoTreeList")) {
element.data("kendoTreeList").destroy();
element.empty();
}
element.kendoTreeList({
dataSource: dataSource,
columnMenu: false,
columns: [
{ field: "FirstName", expandable: true, title: "First Name", width: 250 },
{ field: "LastName", title: "Last Name" },
{ field: "Position" },
{ command: ["edit", "destroy"], title: "", width: "300px" }
],
toolbar: ["create"],
editable: "inline"
});
}
$(document).ready(function() {
$("#language").kendoDropDownList({
change: changeLanguage,
dataTextField: "text",
dataValueField: "value",
dataSource: [
{text: "bg-BG"},
{text: "en-US"},
{text: "de-DE"}
]
});
$("#language").data("kendoDropDownList").trigger("change");
});
</script>
</div>
</body>
</html>