<!doctype html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Auction Nudge Demo - Filtering By Keyword</title> <style type="text/css"> form label { display: block; font-weight: bold; } </style> </head> <body> <p>This example demonstrates how to filter a list of items shown using the grid theme. Items not matching the specified keyword will be hidden. <a href="http://www.auctionnudge.com/demos/demo-filter-by-keyword.html.txt">view the source</a></p> <form> <label for="auction-nudge-filter">Filter</label> <input type="text" name="auction-nudge-filter" id="auction-nudge-filter" value="Enter a keyword…" /> </form> <script type="text/javascript" src="http://www.auctionnudge.com/item_build/js/SellerID/soundswholesale/siteid/3/theme/grid/MaxEntries/20/grid_cols/2/grid_width/100%25/show_logo/1"></script><div id="auction-nudge-items" class="auction-nudge"><a href="http://www.auctionnudge.com/your-ebay-items">eBay items ticker from Auction Nudge</a></div> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> <script type="text/javascript"> function auction_nudge_loaded() { var filter_cleared = false; $(document).ready(function() { //Clear text input on focus (only the first time!) $('#auction-nudge-filter').focus(function() { if(! filter_cleared) { $(this).val(''); filter_cleared = true; } }); //Each time the keyword input field is updated $('#auction-nudge-filter').keyup(function() { var keyword = $(this).val().toUpperCase(); //Iterate over each item title $('#auction-nudge-items strong').each(function() { var cell = $(this).parent('td'); var title = $(this).text().toUpperCase(); //If the title does not contain the keyword then hide the cell if(title.indexOf(keyword) == -1) { cell.hide(); $('td', cell).hide(); } else { cell.show(); $('td', cell).show(); } }); }); }); } </script> </body> </html>