border : booleanDefault: false

When this setting is enabled the content of the tree will be wrapped by borders.

Examples

Material Design True

    
 <div id="tree"></div>
 <script>
     $('#tree').tree({
         dataSource: '/Locations/Get',
         width: 500,
         border: true,
         checkboxes: true
     });
 </script>

  

Material Design False

    
 <div id="tree"></div>
 <script>
     $('#tree').tree({
         dataSource: '/Locations/Get',
         width: 500,
         border: false
     });
 </script>

  

Bootstrap 3 True

    
 <div id="tree"></div>
 <script>
     $('#tree').tree({
         dataSource: '/Locations/Get',
         width: 500,
         uiLibrary: 'bootstrap',
         border: true
     });
 </script>

  

Bootstrap 3 False

    
 <div id="tree"></div>
 <script>
     $('#tree').tree({
         dataSource: '/Locations/Get',
         width: 500,
         uiLibrary: 'bootstrap',
         border: false
     });
 </script>

  

Bootstrap 4 True

    
 <div id="tree"></div>
 <script>
     $('#tree').tree({
         dataSource: '/Locations/Get',
         width: 500,
         uiLibrary: 'bootstrap4',
         border: true
     });
 </script>

  

Bootstrap 4 False

    
 <div id="tree"></div>
 <script>
     $('#tree').tree({
         dataSource: '/Locations/Get',
         width: 500,
         uiLibrary: 'bootstrap4',
         border: false
     });
 </script>

  

Bootstrap 5 True

    
 <div id="tree"></div>
 <script>
     $('#tree').tree({
         dataSource: '/Locations/Get',
         width: 500,
         uiLibrary: 'bootstrap5',
         border: true
     });
 </script>

  

Bootstrap 5 False

    
 <div id="tree"></div>
 <script>
     $('#tree').tree({
         dataSource: '/Locations/Get',
         width: 500,
         uiLibrary: 'bootstrap5',
         border: false
     });
 </script>