Изотопный фильтр ценовой диапазон и поле поиска - PullRequest
Новая
       32

Изотопный фильтр ценовой диапазон и поле поиска

0 голосов
/ 13 мая 2019

Я фильтрую изотопом. Фильтры работают. Поле поиска работает (к сожалению, только если я сначала не активирую фильтр). Но у меня есть проблема. Поле поиска не работает после внесения ценового диапазона. Поле поиска должно работать постоянно, а не только тогда, когда фильтр не активен. Было бы здорово, если бы кто-то мог мне помочь. Спасибо. 

$(document).ready( function(){
    var buttonFilter;
    var suche = $('.filter_search');
    var qsRegex;
    var price = 0;
    var filters = [];

    $(".grid").addClass("show-me");
    filters.push(".show-me");

    var $grid = $('.grid').isotope({
        itemSelector: '.item',
        percentPosition: true,
        getSortData: {
            sortname: '.sort-name',
            sortprice: '.sort-price',
            number: '.sort-price parseInt'
        },

        filter: function(){
            var searchResult = qsRegex ? $(this).text().match(qsRegex) : true;
            var buttonResult = buttonFilter ? $(this).is(buttonFilter) : true;
            return searchResult && buttonResult;
        }
    });

    $('.filters-select').on('change', function(){
        var sortValue = $(this).find(':selected').data('sort-value');
        var direction = $(this).find(':selected').data('sort-direction');
        var isAscending = (direction == 'asc');
        $grid.isotope({ sortBy: sortValue, sortAscending: isAscending });
    });

    $('#noFilterResult').hide();
    var quicksearch = suche.keyup(debounce(function(){
        qsRegex = new RegExp(quicksearch.val(), 'gi');
        $grid.isotope();

        if(!$grid.data('isotope').filteredItems.length){
            $('#noFilterResult').show();
        }else{
            $('#noFilterResult').hide();
        }
    },200));

    function debounce(fn, threshold){
        var timeout;
        return function debounced(){
            if(timeout){
                clearTimeout(timeout);
            }
            function delayed(){
                fn();
                timeout = null;
            }
            timeout = setTimeout(delayed, threshold || 100);
        };
    }

    $("#range").ionRangeSlider({
        hide_min_max: true,
        keyboard: true,
        min: 0,
        max: 999,
        from: 0,
        to: 999,
        type: 'double',
        step: 1,
        prefix: "",
        grid: false,
        onChange: function(data){
            $(".item").each(function(){
                price = parseInt($(this).find(".sort-price").text(), 10);
                if(data.from <= price && data.to >= price){
                    $(this).addClass('show-me');
                }else{
                    $(this).removeClass('show-me');
                }
            });
            $grid.isotope({ itemSelector: '.item', filter: '.show-me' });
        }
    });
});
...