🔔 Alert..!! Get 2 Month Free Cloud Hosting With $200 Bonus From Digital Ocean ACTIVATE DEAL

SimpleSelect is a jQuery plugin which turns the standard select box into a minimal clean dropdown list with fuzzy search (live filter) support. The plugin supports both static and dynamic datasets.

Select live-search Drop-Down-list Drop-Down

Documentation

SimpleSelect

alt text

jQuery Plugin to build select elements with a search feature.

alt text

HTML:

<select id="segment" name="segmentation"></select>

JavaScript

var options = {     terms: [         'JAVASCRIPT',         'PHP',         'BRAZIL',         'CANADA',         'MEAN'     ] }  $('#segment').simpleSelect(options);

Inline,

<select id="segment" name="segmentation">     <option data-defaultSelected>Select</option>      <option>JAVASCRIPT</option>     <option>PHP</option>     <option>BRAZIL</option>     <option>CANADA</option>     <option>MEAN</option> </select>

JavaScript

$('#segment').simpleSelect();

Options

Name Description Default
terms select element options Empty Array []
notFoundMessage Message to show when no terms are found 'Not found.'
defaultSelected Initial select element term (will not be shown in the options) 'Select'

CodePen Example



A little project by Jefferson Ribeiro


You May Also Like