Add a Predefined Search Categories Dropdown

I came up with a way to add a select dropdown so you can have predefined search options. See it live here: http://utahalcoholsales.com/

In the file: jquery.dataTables.min.js

Go to line 37 (or find "var b=a.oClasses,c=a.sTableId,e=a.oLanguage" and add an ID attribute called: "searchBar"

---

Add this above your table (or where ever you like) and change your options.

<label class="filterLabel">Category Search:<br> <select id='filterText' selected="selected" style='display:inline-block;width: 300px;margin-left: 5px;' onchange='filterText()'> <option disabled selected>Select...</option> <option value='Bourbon'>Bourbon</option> <option value='Cabernet'>Cabernet</option> <option value='Champagne'>Champagne</option> <option value='Chardonnay'>Chardonnay</option> <option value='Gin'>Gin</option> <option value='Merlot'>Merlot</option> <option value='Moscato'>Moscato</option> <option value='Pinot Grigio'>Pinot Grigio</option> <option value='Pinot Noir'>Pinot Noir</option> <option value='Rum'>Rum</option> <option value='Schnapps'>Schnapps</option> <option value='Scotch'>Scotch</option> <option value='Tequila'>Tequila</option> <option value='Vodka'>Vodka</option> <option value='Whiskey'>Whiskey</option> </select></label>

---

Add this to your footer:

This will call when the select dropdown changes and replace the value of the search box with the selected value and then simulate a keyup on the search box to trigger the search.

<script>
function filterText()
	{  
document.getElementById('searchBar').value = $('#filterText').val();
$('#searchBar').trigger('keyup');
}
</script>