Added option for show-icon

Updated demo page
This commit is contained in:
Ray 2023-09-27 22:22:56 +01:00
parent 5e64b15f25
commit 8697ba3188
3 changed files with 36 additions and 11 deletions

View File

@ -70,3 +70,7 @@ ul.bbtreeview div.li > span {
vertical-align: top; vertical-align: top;
white-space: nowrap; white-space: nowrap;
} }
ul.bbtreeview div.li > span.noicon {
padding-left: 0px !important;
}

View File

@ -1,6 +1,6 @@
/** /**
* BBTreeview * BBTreeview
* @version v0.1.0.244 (2023/09/11 2327) * @version v0.1.1.006 (2023/09/27 2218)
*/ */
function BBTreeview(options) function BBTreeview(options)
{ {
@ -65,7 +65,8 @@ BBTreeview.prototype.Default = function() {
ID: null, ID: null,
ShowCheckbox: false, ShowCheckbox: false,
ShowSelection: true, ShowSelection: true,
EnablePullUp: false EnablePullUp: false,
ShowIcon: true
}, },
TreeNodeOptions: { TreeNodeOptions: {
ID: null, ID: null,
@ -295,8 +296,13 @@ BBTreeview.prototype.generateNodeHtml = function(options) {
html += '<div class="icon checkbox"></div>'; html += '<div class="icon checkbox"></div>';
} }
html += '<div class="icon ' + options.Icon + '"></div>'; if (a.Options.ShowIcon) {
html += '<span title="' + options.Hint + '">' + options.Name + '</span>'; html += '<div class="icon ' + options.Icon + '"></div>';
html += '<span title="' + options.Hint + '">' + options.Name + '</span>';
} else {
html += '<span class="noicon" title="' + options.Hint + '">' + options.Name + '</span>';
}
html += '</div>'; html += '</div>';
html += '<ul></ul>'; html += '<ul></ul>';
html += '</li>'; html += '</li>';

View File

@ -10,11 +10,11 @@
<!-- <script src="http://cdn.hiimray.co.uk/8206c600-707c-469e-8d49-a76ae35782af/bootstrap/5.3.0/dist/js/bootstrap.bundle.min.js"></script> --> <!-- <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="http://cdn.hiimray.co.uk/8206c600-707c-469e-8d49-a76ae35782af/bootstrap/5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" /> -->
<!-- <link href="src/bbtreeview.css" rel="stylesheet" /> --> <link href="bbtreeview.css" rel="stylesheet" />
<link href="bbtreeview.min.css" rel="stylesheet" /> <script src="bbtreeview.js"></script>
<!-- <script src="bbtreeview.js"></script> --> <script src="bbtreeviewnode.js"></script>
<!-- <script src="bbtreeviewnode.js"></script> --> <!-- <link href="bbtreeview.min.css" rel="stylesheet" /> -->
<script src="bbtreeview.min.js"></script> <!-- <script src="bbtreeview.min.js"></script> -->
<title></title> <title></title>
</head> </head>
@ -34,6 +34,7 @@
<p><button onclick="CreateTreeview(1)">Create Treeview (Checkbox and Selection)</button></p> <p><button onclick="CreateTreeview(1)">Create Treeview (Checkbox and Selection)</button></p>
<p><button onclick="CreateTreeview(2)">Create Treeview (Checkbox, Hide Selection, Enable Pull-Ups)</button></p> <p><button onclick="CreateTreeview(2)">Create Treeview (Checkbox, Hide Selection, Enable Pull-Ups)</button></p>
<p><button onclick="CreateTreeview(3)">Create Treeview (No Checkbox, Selection)</button></p> <p><button onclick="CreateTreeview(3)">Create Treeview (No Checkbox, Selection)</button></p>
<p><button onclick="CreateTreeview(4)">Create Treeview (No Checkbox, No Icons, Selection)</button></p>
</div> </div>
<div class="panel"> <div class="panel">
@ -94,11 +95,13 @@
<style> <style>
body { body {
padding: 20px; padding: 10px;
} }
.column { .column {
width: 50%; min-height:400px; float: left float: left;
min-height: 400px;
width: 50%;
} }
.panel { .panel {
@ -146,10 +149,22 @@ function CreateTreeview(value){
EnablePullUp: false EnablePullUp: false
}); });
break;
case 4:
window.treeview1 = new BBTreeview({
ID: "#treeview1",
ShowCheckbox: false,
ShowSelection: true,
EnablePullUp: false,
ShowIcon: false
});
break; break;
default: default:
break; break;
} }
LoadTreeview();
} }
function LoadTreeview(){ function LoadTreeview(){