Комбинирование 2 разных вложенных фильтров с Isotope

поэтому я играю с библиотекой js-isotope. пока работает отлично, но есть проблема с конкретной задачей.

У меня есть сетка, в которой представлены бренды одежды. бренды расположены по начальной букве.

так это выглядит так: http://towa-online.at/sagmeister/marken/

я создал 2 изотопных объекта:

  1. алфавит-сетка: элементы-сетки, содержащие список брендов

var $container_alphabet = $( '.sagmeister-brand-grid' ).isotope({
  itemSelector: '.grid-item',
  masonry: {
    gutter: 40,
    columnWidth: 320
  },
  filter          : '*',
  animationOptions: {
    duration: 750,
    easing  : 'linear',
    queue   : false
  }
});

  1. бренд-сетка: каждый список внутри алфавита

var $container_brands = $( 'ul.brand-by-letter' ).isotope({
  itemSelector    : '.brand-name',
  layoutMode      : 'vertical',
  filter          : function(){
    var $this = $( this );
    var result_query = search_query ? $this.text().match( search_query ) : true;
    var result_cat   = search_cat ? $this.is( search_cat ) : true;
    return result_query && result_cat;
  },
  animationOptions: {
    duration: 750,
    easing  : 'linear',
    queue   : false
  }
});

что я хочу сделать, так это после фильтрации брендов (которая отлично работает) я проверяю событие "rangeComplete ", возможно, некоторые буквы пустые. если это так, я добавляю класс «no-items» к элементу сетки из алфавитной сетки, и в конце я запускаю изотоп для этого.

$container_brands.on( 'arrangeComplete', function( event, filteredItems ){
  var $grid_item = $( '#' + event.currentTarget.id ).parent();
  var has_items  = ( filteredItems.length > 0 );

  if ( has_items ){
    $grid_item.removeClass( 'no-items' ).addClass( 'has-items' );          
  } else {
    $grid_item.removeClass( 'has-items' ).addClass( 'no-items' );
  }
  if ( $grid_item.is( ':last-child' ) )
    $container_alphabet.isotope();
});

похоже, что срабатывание срабатывает не каждый раз, а лишь время от времени.

кто-нибудь думал об этом?


javascript jquery jquery-isotope
person SahinU88    schedule 13.12.2015    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Итак, я смог сам найти решение. в любом случае спасибо, это помогло мне описать проблему и еще раз взглянуть на нее :)

Мое решение состояло в том, чтобы немного изменить структуру, а затем я добавил настраиваемую функцию фильтра для элементов сетки для алфавита, которая проверяет, все ли дочерние элементы отфильтрованы или нет. если да, скройте элемент алфавита :)

хорошее начало недели, вот так ^^

ваше здоровье

PS: если вам нужно более подробное объяснение, не стесняйтесь спрашивать. буду рада помочь!

person SahinU88    schedule 14.12.2015