jQuery Isotope - проблема с несколькими фильтрами

Я пытаюсь использовать несколько фильтров на странице, похожей на портфолио, которая использует Isotope.js. Взгляните на эту страницу: http://decart-design.com/avancia-wp/vi-tilbyr/. Один фильтр работает нормально, но не несколько фильтров :( Вот фрагмент JS-кода, который я использую:

jQuery('.filtering li').on('click', 'a', function(e) {
e.preventDefault();

if ( jQuery(this).parent().hasClass('selected') ) {
    return;
}

var filters = {},
    optionSet = jQuery(this).parents('.option-set');

jQuery(this).parent().parent().find('li').removeClass('selected');
jQuery(this).parent().addClass('selected');

var group = optionSet.data('filter-group');
filters[group] = jQuery(this).data('filter');

var isoFilters = [];
for ( var prop in filters ) {
    isoFilters.push( filters[prop] );
}
var selector = isoFilters.join('');
var portfolioItems = jQuery(this).parent().parent().parent().parent().find('.filterable-items');
portfolioItems.isotope({ filter: selector });

console.log(selector);

return false;

});

По какой-то причине (я не знаю почему), но isoFilters.push( filters[prop] ); просто не работает. После того, как я щелкну второй фильтр, массив элементов просто заменен новым значением, а не добавлен в этот массив. Как вы можете видеть в консоли, оно просто заменено новым значением, а не добавлено в массив. Это так странно ...

Вот рабочий пример с веб-сайта автора: http://isotope.metafizzy.co/demos/combination-filters.html.

Не мог бы кто-нибудь помочь мне понять, что я делаю не так? Заранее спасибо! Надеюсь, кто-нибудь поможет мне решить эту проблему.

С уважением, Алекс


filter jquery-isotope
person Nekto    schedule 25.01.2014    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Я нашел способ решить эту проблему. Вот правильный код:

jQuery('.filtering li').on('click', 'a', function(e) {
e.preventDefault();

if ( jQuery(this).parent().hasClass('selected') ) {
 return;
}

jQuery(this).parent().parent().find('li').removeClass('selected');
jQuery(this).parent().addClass('selected');

var isoFilters = [];
var elems = jQuery(this).parents('.filter-wrap').find('li.selected a');
jQuery.each(elems, function(i, e){
  isoFilters.push(jQuery(e).attr('data-filter'));
});

var selector = isoFilters.join('');
var portfolioItems = jQuery(this).parent().parent().parent().parent().find('.filterable-items');
portfolioItems.isotope({ filter: selector });

console.log(selector);

return false;

});

Надеюсь, это поможет тому, кто столкнулся с подобной проблемой.

person Nekto    schedule 29.01.2014