2023-09-10 01:06:33 +00:00
|
|
|
<!doctype html>
|
|
|
|
|
<html lang="en-GB">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8" />
|
|
|
|
|
<meta http-equiv="content-type" content="text/html" charset="UTF-8" />
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
|
|
|
<meta name="description" content="" />
|
|
|
|
|
<meta name="keyword" content="" />
|
|
|
|
|
|
|
|
|
|
<script src="http://cdn.hiimray.co.uk/8206c600-707c-469e-8d49-a76ae35782af/bootstrap/5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
|
|
|
|
<link href="http://cdn.hiimray.co.uk/8206c600-707c-469e-8d49-a76ae35782af/bootstrap/5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" />
|
|
|
|
|
|
|
|
|
|
<link href="bbtreeview.css" rel="stylesheet" />
|
2023-09-10 12:41:58 +00:00
|
|
|
<script src="bbtreeview.js"></script>
|
|
|
|
|
<script src="bbtreeviewnode.js"></script>
|
2023-09-10 01:06:33 +00:00
|
|
|
|
|
|
|
|
<title></title>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
2023-09-10 12:41:58 +00:00
|
|
|
<div class="column">
|
2023-09-10 01:06:33 +00:00
|
|
|
|
2023-09-10 12:41:58 +00:00
|
|
|
<div id="treeview1"></div>
|
2023-09-10 01:06:33 +00:00
|
|
|
|
2023-09-10 12:41:58 +00:00
|
|
|
</div>
|
|
|
|
|
<div class="column">
|
|
|
|
|
<div class="panel">
|
2023-09-10 01:06:33 +00:00
|
|
|
|
2023-09-10 12:41:58 +00:00
|
|
|
<p>Create demo treeview with checkboxes</p>
|
|
|
|
|
<button onclick="CreateTreeview()">Create Treeview</button>
|
2023-09-10 01:06:33 +00:00
|
|
|
|
2023-09-10 12:41:58 +00:00
|
|
|
</div>
|
|
|
|
|
<div class="panel">
|
2023-09-10 01:06:33 +00:00
|
|
|
|
2023-09-10 12:41:58 +00:00
|
|
|
<p>Clear treeview</p>
|
|
|
|
|
<button onclick="ClearTreeview()">Clear Treeview</button>
|
2023-09-10 01:06:33 +00:00
|
|
|
|
2023-09-10 12:41:58 +00:00
|
|
|
</div>
|
|
|
|
|
<div class="panel">
|
2023-09-10 01:06:33 +00:00
|
|
|
|
2023-09-10 12:41:58 +00:00
|
|
|
<p>Remove the "Program Files" treenode</p>
|
|
|
|
|
<button onclick="RemoveTreeNode()">Remove Treenode</button>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
|
|
|
|
|
body {
|
|
|
|
|
padding: 20px;
|
2023-09-10 01:06:33 +00:00
|
|
|
}
|
|
|
|
|
|
2023-09-10 12:41:58 +00:00
|
|
|
.column {
|
|
|
|
|
width: 50%; min-height:400px; float: left
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.panel {
|
|
|
|
|
border-color:black;
|
|
|
|
|
border-style: solid;
|
|
|
|
|
border-width: 0 0 1px 0;
|
|
|
|
|
padding: 0 0 20px 0;
|
|
|
|
|
margin: 0 0 20px 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
</style>
|
2023-09-10 01:06:33 +00:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
2023-09-10 12:41:58 +00:00
|
|
|
<script>
|
|
|
|
|
|
|
|
|
|
var treeview1 = new BBTreeview({
|
|
|
|
|
ID: "#treeview1",
|
|
|
|
|
ShowCheckbox: true,
|
|
|
|
|
ShowSelection: true
|
2023-09-10 01:06:33 +00:00
|
|
|
});
|
|
|
|
|
|
2023-09-10 12:41:58 +00:00
|
|
|
|
|
|
|
|
function CreateTreeview(){
|
|
|
|
|
|
|
|
|
|
treeview1.AddItem({
|
|
|
|
|
ID: "root",
|
|
|
|
|
Name: "C:\\"
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
let folders1 = [
|
|
|
|
|
"AndroidSDK",
|
|
|
|
|
"Game Files",
|
|
|
|
|
"Program Files",
|
|
|
|
|
"Program Files (x86)",
|
|
|
|
|
"Users",
|
|
|
|
|
"Windows"
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
for (let i=0; i<folders1.length; i++) {
|
|
|
|
|
treeview1.AddItem({
|
|
|
|
|
ID: "0_" + i,
|
|
|
|
|
ParentID: "root",
|
|
|
|
|
Name: folders1[i]
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
let folders12 = [
|
|
|
|
|
"7-Zip",
|
|
|
|
|
"Common Files",
|
|
|
|
|
"Git",
|
|
|
|
|
"Internet Explorer",
|
|
|
|
|
"MSBuild"
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
for (let i=0; i<folders12.length; i++) {
|
|
|
|
|
treeview1.AddItem({
|
|
|
|
|
ID: "0_2_" + i,
|
|
|
|
|
ParentID: "0_2",
|
|
|
|
|
Name: folders12[i]
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
let folders13 = [
|
|
|
|
|
"Common Files",
|
|
|
|
|
"Internet Explorer"
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
for (let i=0; i<folders13.length; i++) {
|
|
|
|
|
treeview1.AddItem({
|
|
|
|
|
ID: "0_3_" + i,
|
|
|
|
|
ParentID: "0_3",
|
|
|
|
|
Name: folders13[i]
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
let folders15 = [
|
|
|
|
|
"System",
|
|
|
|
|
"System32",
|
|
|
|
|
"Temp"
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
for (let i=0; i<folders15.length; i++) {
|
|
|
|
|
treeview1.AddItem({
|
|
|
|
|
ID: "0_5_" + i,
|
|
|
|
|
ParentID: "0_5",
|
|
|
|
|
Name: folders15[i]
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
treeview1.AddItem({
|
|
|
|
|
ID: "0_2_3_0",
|
|
|
|
|
ParentID: "0_2_3",
|
|
|
|
|
Name: "en-GB"
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function ClearTreeview() {
|
|
|
|
|
treeview1.Clear();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function RemoveTreeNode() {
|
|
|
|
|
treeview1.Remove("0_2");
|
|
|
|
|
}
|
2023-09-10 01:06:33 +00:00
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
