Сообщений в теме: 4

[mindguru]

Доброго времени суток! Ситуация следующая. Есть какое-то поле фильтра (для определённости - "производители"). По условиям задачи удобнее всего использовать список флажков. Так вот. Если различных значений этого поля достаточно много, список получается длинным. Возможно ли сократить его, допустим, до пяти строк, а ниже написать что-нибудь типа "развернуть" - и по нажатию мышки развернуть оставшиеся эн строк? Наверняка вы неоднократно встречали аналогичные JavaScripts. Вопрос в том, как сделать работающую и совместимую-с-JBZooSearch модель?

[Sliapy]

В этой теме (правда на английском) обсуждалась почти аналогичная задача - http://forum.jbzoo.c...xpandable-list/

[mindguru]

Извините, мы не можем найти это!

[Sliapy]

Понятно. Вот сообщение с решением. Но оно для шаблона фильтра inline. Можете адаптировать его под свои нужды.
 
 

I've tried to make something similar on a copy of JBZoo demo and it worked fine.
 
So basically you should set a fixed height on a div with filter options and "overflow: hidden". Then add a trigger element and after pressing it you should set height to auto.
 
I'll try to adapt my code to your layout here so you'll be able to try it.
 
This goes to css:

.filter-fields .filter-inline .element-jqueryui .field {

    overflow: hidden;

    height: 95px;

}



.filter-fields .filter-inline .element-jqueryui .field.expanded {

    height: auto;

}



.toggleheight {

    text-align: center;

    cursor: pointer;

}

And you need a js script too:

jQuery(document).ready(function() {

   jQuery(".filter-fields .filter-inline .element-jqueryui .field").after( "<div class='toggleheight'>&#9660;</div>" );

    jQuery(".toggleheight").click(function(){

        jQuery(this).prev().toggleClass("expanded");

    });

});

In order for this to look properly you should have more than three options in your filters. So try to add this code and more options and we'll see how it works for you.

[mindguru]

Спасибо.