View on GitHub:


JQuery Version Vanilla JS Version

Check Github for new available features unlisted here!

Demonstration

This plugin replaces native select elements with fully customizable dropdowns:

Original:

BVSelect Plugin:

Dropdown only:

with SearchBox:


Even though this replaces native select options, you can still use Form Submit, Onchange Events and Attributes as you would with normal usage.

Installation

1 - Include jQuery Plugin.

<script src="path/to/jquery.js"></script> 
<script src="path/to/bvselect.js"></script>

2 - Include Plugin Styles.

<link rel="stylesheet" href="path/to/bvselect.css">

4 - Set HTML.

<select id="selectbox">
  <option data-separator="true"> Select Option </option>
  <option value="1"> Option 1 </option>
  <option value="2"> Option 2 </option>
  <option value="3" disabled> Option 3 </option>
  <option value="4"> Option 4 </option>
</select>

3 - Initilize Plugin.

$(document).ready(function() {
  $('#selectbox').BVSelect({
      width: "200px",
      searchbox: false
  });
});

Methods

Currently BVSelect supports two methods.

Destroy:

$('#selectbox').BVSelect("destroy");

Removes dropdown, unbinds all its events and brings back the original Select Box

Update:

$('#selectbox').BVSelect("update");

Updates current dropdown based on changes to the original selectbox.

Options

Currently BVSelect supports following options:

$('#selectbox').BVSelect({
      width: "200px", // Pixel, Percentage, etc...
      searchbox: true // true or false to add searchbox to dropdown
});

Frequently Asked Questions

Is there any themes?

It doesn't need themes since the CSS is fully customizable, you are able to change everything to match your style.

In addition to design, what changes?

This plugin replaces the original SelectBox but you can use it as you would with a native one, OnChange Events, Attributes, Form Submit, Append/Remove Options, everything.

What about Browser Compatibility?

It was tested successfully in every modern browser as well as IE 11


Developed By: Bruno Vieira