jQuery Collecting Filter Options from Content
Now we need to expand the filter options to cover the range of available topics in the table. Rather than hard-coding all of the topics, we can gather them from the text that has been entered in the table. We can change the definition of keywords to read:
Sample Code
var keywords = {}
$table.find('tbody tr td').filter(':nth-child(' + (column + 1) +
')').each(function() {
keywords[$(this).text()] = $(this).text()
})
Copyright exforsys.com
This code relies on two tricks:
- By using a map rather than an array to hold the keywords as they are found, we eliminate duplicates automatically.
- jQuery's $.each() function lets us operate on arrays and maps identically, so no later code has to change. Now we have a full complement of filter options:
Reversing the Filters
For completeness, we need a way to get back to the full list after we have filtered it.
Adding an option for all topics is pretty straightforward:
Sample Code
$('</p><br>
<div class="filter">all</div>
').click(function() {
$table.find('tbody tr').show()
$(this).addClass('active').siblings().removeClass('active')
}).addClass('clickable active').appendTo($filters)
Copyright exforsys.com
This gives us an all button that simply shows all rows of the table again. For good measure we mark it as active to begin with.
Tutorials 
