Customizing select boxes with Select2 plugin
In this recipe, we will look into another excellent plugin for customizing select boxes, available at https://select2.github.io/. The repository can be found at https://github.com/select2/select2.
Getting ready
In this recipe, we will implement Select2 plugin's version of multiple select boxes. That way, we can easily compare the look and feel of this plugin's features with the Bootstrap Select plugin that we covered in the previous chapter.
To get ready, navigate to https://select2.github.io/examples.html#multiple and test the functionality in the example.
How to do it…
- In
app/_layout.ejs, reference the CSS file from CDNJS:
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
- In
app/partials/_js.ejs, call the JS file from CDNJS:
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
- Copy the following code and paste it into
app/recipe06-05...
