list-filter

Simple library with no dependencies that help you to hide html list items or table rows that do not match a pattern

Table of Contents

• Demo
• Installation
• Usage
• Configuration
• Examples

Demo

Try it on JSFiddle

Installation

npm install --save @mp3000mp/list-filter

Usage

// This will create window.ListFilter
const ListFilter = require('list-filter')

Example

You have to create a new instance for binding a list to an input trigger

// on document ready
document.addEventListener('DOMContentLoaded', function(){
    let trigger = document.getelementById('my-trigger');
    let list = document.getelementById('my-list'); // works with table or ul element
    let options = {};

    let oListFilter = new ListFilter(trigger, list, options);
});

Configuration

Here are the key you can use to configure your instance

Key	Type	Default	Description
caseSensitive	boolean	false	Case sensitive search or not.
keyupDelay	Number	50	Time in millisecond before refreshing the DOM.
searchInAttribute	boolean or string	false	Data attribute used for comparison, innerHTML if false.
onSearch	Callback	null	Function to run after each comparison, return true to display the element, false to hide it.
onAfterSearch	Callback	null	Function to run after DOM refresh.