Never Push to Master

    @lovata/shopaholic-search

    1.1.4 • Public • Published

    Search for Shopaholic package

    Package adds helper methods for integration with Search for Shopaholic and Shopaholic plugins.

    Package will allow you to quickly add search bar in your project.

    installation

    npm install @lovata/shopaholic-search

    Basic usage

    <input type="text" class="_shopaholic-search-input" name="search-input" value="">

    Simple example:

    import ShopaholicSearch from "@lovata/shopaholic-search";
    
    const obHelper = new ShopaholicSearch();
    obHelper.setAjaxRequestCallback(function(obRequestData) {
      obRequestData.loading = '.preloader';
      obRequestData.update = {'search/search-result': '.search-result-wrapper'};
      
      return obRequestData;
    }).init();

    Advanced example:

    import ShopaholicSearch from "@lovata/shopaholic-search";
    
    const obHelper = new ShopaholicSearch();
    obHelper
      .setSearchLimit(5)
      .setSearchDelay(600)
      .setAjaxRequestCallback(function(obRequestData) {
        obRequestData.loading = '.preloader';
        obRequestData.update = {'search/search-result': '.search-result-wrapper'};
    
        return obRequestData;
      }).init();

    Methods

    init()

    Method adds 'change' event listener on search input.

    setAjaxRequestCallback()

    You can set callback function. This callback function will be called before sending ajax request.

    You can change request object inside callback function. For example: add called partial and selector, add preloader class, etc.

    import ShopaholicSearch from "@lovata/shopaholic-search";
    
    const obHelper = new ShopaholicSearch();
    obHelper.setAjaxRequestCallback(function(obRequestData) {
      obRequestData.loading = '.preloader';
      obRequestData.update = {'search/search-result': '.search-result-wrapper'};
      
      return obRequestData;
    }).init();

    setSearchLimit()

    You can to redeclare default search limit value. Default value is 3 symbols. Ajax request will be sent only when user enters the number of characters greater than or equal to specified value.

    import ShopaholicSearch from "@lovata/shopaholic-search";
    
    const obHelper = new ShopaholicSearch();
    obHelper.setSearchLimit(5).init();

    setSearchDelay()

    You can to redeclare default search delay value. Default value is 400 ms. Ajax request will be sent only when user does not press keys during the delay time.

    import ShopaholicSearch from "@lovata/shopaholic-search";
    
    const obHelper = new ShopaholicSearch();
    obHelper.setSearchDelay(600).init();

    License

    © 2019, LOVATA Group, LLC under GNU GPL v3.

    Developed by Andrey Kharanenka.

    Install

    npm i @lovata/shopaholic-search

    DownloadsWeekly Downloads

    6

    Version

    1.1.4

    License

    GPL-3.0-or-later

    Unpacked Size

    41.8 kB

    Total Files

    4

    Last publish

    Collaborators

    • lautsevich
    • andrey_kharanenka