Search result of a table on jsfiddle

Question

I'm wanting to add a table into my site with a search bar at the top. However i want the table results to be hidden then show one result when searched. So in other words a search bar that shows a result below.

For example this table i created with a search bar at the top and hides all the results until searched for - jsfiddle.net/abkNM/6339/

Answer 1

I'm not sure why you'd want to do this since it is the opposite of what users expect, but all you need is this extra bit of code (demo):

$('table').on('filterEnd', function(){
    if ( this.config.lastSearch.join('') === '') {
        $(this).children('tbody').children().addClass('filtered');
    }
});