Simple Combobox | highlighting and searching

fullMatch, filterIgnoreCase and hideSeparatorsOnSearch options

by Tyson Koska

HTML

<script src="http://kremer.pro/projects/scombobox/js/jquery.scombobox.js"></script>
<link rel="stylesheet" href="http://kremer.pro/projects/scombobox/css/jquery.scombobox.css">
<script src="http://kremer.pro/projects/scombobox/js/jquery.easing.min.js"></script>
<!-- first combo-box which has an ID and Class-->
<select id="combo1" class="combo">
    <option value="1">opt1</option>
    <option value="2">opt2</option>
    <option value="3">opt3</option>
</select>

<!-- second combo-box has a Class only -->
<select class="combo">
    <option value="1">opt1</option>
    <option value="2">opt2</option>
    <option value="3">opt3</option>
</select>

CSS

body {
    padding: 23px 0 0 0;
    font-family: Arial, 'sans-serif';
    font-size: 90%;
    color: #333;
    background: #FAFAFA;
}

JavaScript

$('.combo').scombobox({
    forbidInvalid: false,
    invalidAsValue: true
});

//setting value works fine if selector uses ID
//$('#combo1').scombobox('val', 'opt3');

//tried to set all combo-boxes at once, doesn't work
//$('.combo').scombobox('val', 'opt3');
//$('.scombobox').scombobox('val', 'opt3');

//cycle through each combo-box and set, using 'scombobox' class
$('.scombobox').each(function(key, item){
	if (key === 0) $(this).scombobox('val', 'opt4');
    else $(this).scombobox('val', 'opt5');
});