Creating a custom single-selection list
In the previous recipe, we used Chosen. In this recipe, we will take a deeper look into the creation of simple select boxes, making one the most user-friendly way pickers out there.
Getting ready
In this recipe, we will use Chosen (https://github.com/harvesthq/chosen) and its dependency jQuery by adding them from a CDN.
How to do it...
We create an HTML file and the accompanying JavaScript code:
First, we will start with the head section of the HTML, where we will include the Chosen CSS style:
<head> <meta charset="utf-8"> <title>Single select list</title> <link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/chosen/0.9.11/chosen.css"> <style type="text/css"> .drop-down{ width: 250px; } </style> </head>We are going to create a simple form where the user can select their favorite programming language and job title. To do that, we add
selectelements...
