jQuery Plugin For Custom Editable Select Box - editable-select

File Size: 15.6 KB
Views Total: 7923
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
jQuery Plugin For Custom Editable Select Box - editable-select

A tiny jQuery plugin used to create a custom editable select box where you can add new select options in the input field.

How to use it:

1. Place the style sheet editable-select.css in the header to style the select box.

<link rel="stylesheet" href="editable-select.css">

2. Place the JavaScript file editable-select.js after jQuery library but before the closing body tag.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="jquery-editable-select.js"></script>

3. Include the Font Awesome for caret icons.

<link rel="stylesheet" href="/path/to/font-awesome.min.css">

4. Call the function on the target select box and done.


5. Default plugin options.

  warpClass: 'ui-select-wrap',
  editable: true

Change log:


  • update jquery-editable-select.js


  • Added 'editable' option


This awesome jQuery plugin is developed by shaoyun. For more Advanced Usages, please check the demo page or visit the official website.