jQuery <select/> filter
First I was like:
<script>
$(document).ready(function(){
jQuery.extend(jQuery.expr[':'], {
containsIgnoreCase:
"(a.textContent||a.innerText||jQuery(a).text()||'').toLowerCase().indexOf((m[3]||'').toLowerCase())>=0"
});
$('input.filterer').keyup(function(){
$('#'+$(this).attr('target_id')+' option').show().not(':containsIgnoreCase('+$(this).val()+')').hide()
});
});
</script>
<input class="filterer" target_id="target_select_id" type="text"/>
But then IE made me do:
<script>
$(document).ready(function(){
jQuery.extend(jQuery.expr[':'], {
containsIgnoreCase:
"(a.textContent||a.innerText||jQuery(a).text()||'').toLowerCase().indexOf((m[3]||'').toLowerCase())>=0"
});
$('input.filterer').each(function(){
$('<select id="'+$(this).attr('target_id')+'_stash" style="display:none;" />')
.insertBefore($('#'+$(this).attr('target_id')));
});
$('input.filterer').keyup(function(){
var visible_select = '#'+$(this).attr('target_id');
var hidden_select = visible_select+'_stash';
var needle = $(this).val();
$(visible_select+' option').not(':containsIgnoreCase('+needle+')').remove()
.appendTo($(hidden_select)).removeAttr('selected');
$(hidden_select+' option:containsIgnoreCase('+needle+')').remove()
.appendTo($(visible_select)).removeAttr('selected');
});
});
</script>
<input class="filterer" target_id="target_select_id" type="text"/>