I need to integrate a tree view using the select2 plugin, but I'm having trouble with the basic configuration. Can someone provide some assistance? The desired result can be viewed here.
Below is the code I've attempted so far:
$('.js-example-basic-single').select2({
placeholder: 'Select an option'
});select {
width: 100%;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.min.js"></script>
<link href='https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.min.css'>
<select name="" id="" class="js-example-basic-single">
<option value="main">Pepal Inc.</option>
<option value="child1">Business Unit 1</option>
<option value="child1">Sub Business Unit 1</option>
<option value="child-level1">Sub Sub Business Unit 1</option>
<option value="child-level1">Business Unit 2</option>
<option value="child-level1">Business Unit 3</option>
<option value="child1">Sub Business Unit 3</option>
<option value="child-level1">Sub Sub Business Unit 3</option>
</select>