jQuery Plugin For Custom Select Dropdown List

Custom Select Combo is a tiny jQuery plugin which allows your user to input custom values to an existing select drop down list.

How to use it:

1. Include the lasted jQuery javascript library and jQuery Custom Select Combo on your web page

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript" src="custom-select-combo.js"></script>

2. The markup

<select id="example" data-verbose='true' class="custom-select-combo">
<option value='dog'>Dog</option>
<option value='cat'>Cat</option>
<option value='custom'>Custom</option>
</select>

3. Call the plugin

<script type="text/javascript">
$(document).ready(function() {
$('.custom-select-combo').customSelectCombo();
})
</script>

4. All the options

$('.custom-select-combo').customSelectCombo({
  alwaysShowInput: false, // show input regardless of selection
  customInputTarget: null, // id of element to attach the custom input to
  hideSelectOnTrigger: false, // if true, hides original select box when trigger options are selected
  inputDimensions: 'auto', // dimensions of the custom input. [width, height], 'default' or 'auto'
  setInputValueOnTrigger: true, // set the value of the input when triggered
  triggerValues: ['custom'], // option values on which to trigger the custom input
  verbose: false // output stuff to console
});

---

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