rg-search

0.0.7 • Public • Published

Build Status Test Coverage Code Climate Issue Count Dependencies

NPM

Installation

npm install rg-search

Usage

var travelSearch = new RGsearch(name, options);

rg-search does not care about what kind of elements or methods you use to apply filters to the search. The only thing it cares about is reading the filter keys and values from the elemens containing these. rg-search will work the these data attributes

  • data-rgsearch-filter-keys
  • data-rgsearch-filter-values

Your initial markup should contain the data-attributes with the initial values eg:

<ul class="rgsearch-filter" data-rgsearch-filter-keys="key1, key2" data-rgsearch-filter-values="value1, value2">
    <li>
        <input type="checkbox" onclick="travelSearch.applyFilters(['key1', 'key2'], ['value2', 'value1'])"> <span>Value 1</span>
        <input type="checkbox" onclick="travelSearch.applyFilters(['key1', 'key2'], ['value1', 'value2'])"> <span>Value 2</span>
    </li>
</ul>

This elements will be selected by the classname rgsearch-filer. So you MUST apply this classname to whatever element also containing the filter data attributes.

To change the filters so that the search will update, you just call the applyFilters method, wil two arrays as parameters. The first array should be the filter-keys to update, and the last array should be the values to update to. The two array MUST be in the same order to work properly. You dont need to call the applyFilter method from onclick in the markup. It can just as well be used from inside any javascript you use to control your search-app. eg:

element.on("click", function() {
    travelSearch.applyFilters(["key1", "key2"], ["value1", "value2"]);
});

Package Sidebar

Install

npm i rg-search

Weekly Downloads

5

Version

0.0.7

License

MIT

Last publish

Collaborators

  • glenn.abrahamsen