Simple html filter while typing on input

html:
<input type="text" id="filter" class="form-control"/>
<table class="table table-bordered table-condensed">
    {% for u in popular_urls %}
        <tr>
            <td class="url_item">
                {{ u }}
            </td>
        </tr>
    {% endfor %}
</table>

$(document).off('keyup', '#filter');
$(document).on('keyup', '#filter', function () {
 filter_items($(this).val())
});

function filter_items(text) {
 $('.url_item').each(function () {
 if ($(this).html().toString().indexOf(text) > -1) {
 $(this).parent().show()
 } else {
 $(this).parent().hide()
 }
 })
}
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s