Slick: Filter not working with rows

Created on 29 Nov 2015 · 15Comments · Source: kenwheeler/slick

Title. Filters are not working when using rows. :sob:

without rows: working

with rows: not working

Confirmed

Source

boop5

👍1

Most helpful comment

I wrote a fix myself, I do *_not *_ rely on .slick( 'slickFilter' ) nor I altered the Slick library. Who knows it will be broken again in the future when you update your slick and your fix is not added.

Here you go if someone is interested:

var $slider = $( '.slick-slider' );
var $slider_clone = $slider.clone( true, true ); // add true, true to clone events too!

// When someone clicks on a filter
$( '.filter-item').on( 'click', function(){
    var filter_name = $( this ).text();

    // Create a new clone for the slider items
    var $new_slider = $slider_clone.clone( true, true );

    // Clear current slider
    $slider.slick( 'unslick' ); // Remove slick
    $slider.empty(); // Remove elements

    // Show only filtered items
    if( filter_name == "All" ) {
        $slider.append( $new_slider.find( '.project-item-wrapper' ) );
    } else {
        $slider.append( $new_slider.find( '.project-item-wrapper.' + filter_name ) );
    }

    // Slick slider init or call your function that does it like I do
    init_projecten_slider();
});

basepack on 15 Apr 2016

👍3

All 15 comments

A shame this bug is around. I was messing with it last night wondering why what I was doing wasn't working... so decided to check bugs and here it is.

Do you know of any good workaround for this?

NotoriousV2 on 10 Dec 2015

Downgrading to 1.5.8 worked for me.

funkjedi on 22 Dec 2015

Sorry about this, looking into it

kenwheeler on 22 Dec 2015

Downgrading to 1.5.8 doesn't worked for me, i've tried several versions from the 1.5.* : same results.

apsylone on 22 Dec 2015

Just letting you know: I'll be happy if this bug gets fixed but I can't help troubleshooting for now. Since it was urgent I wrote my own solution.

boop5 on 22 Dec 2015

Can you maybe share it with us ?! It was urgent with me too... :-)

apsylone on 22 Dec 2015

It's a very specific + quick&dirty solution. You'll be faster writing your
own ;)

On Tue, Dec 22, 2015 at 7:56 PM, Benjamin Jeanjean <[email protected]

wrote:

Can you maybe share it with us ?! It was urgent with me too... :-)

2015-12-22 19:55 GMT+01:00 babbelnedd [email protected]:

Just letting you know: I'll be happy if this bug gets fixed but I can't
help troubleshooting for now. Since it was urgent I wrote my own
solution.

—
Reply to this email directly or view it on GitHub
<https://github.com/kenwheeler/slick/issues/1924#issuecomment-166702666
.

Benjamin Jeanjean
CEO - Gobeliner Fondateur
06 23 75 79 20 - [email protected]

_The Gobeliners_ http://www.thegobeliners.com
*Agence de communication et d'idées *
462 rue Benjamin Delessert https://goo.gl/maps/x0Pld
77550 Moissy Cramayel https://goo.gl/maps/x0Pld

[email protected] - 09 72 36 42 10

Stay in touch : Facebook http://www.facebook.com/TheGobeliners -
Twitter
http://twitter.com/thegobeliners

—
Reply to this email directly or view it on GitHub
https://github.com/kenwheeler/slick/issues/1924#issuecomment-166702912.

boop5 on 22 Dec 2015

Okay, I will :-)

Thanks @babbelnedd

apsylone on 22 Dec 2015

Any news on this one?

basepack on 15 Apr 2016

Here you go if someone is interested:

var $slider = $( '.slick-slider' );
var $slider_clone = $slider.clone( true, true ); // add true, true to clone events too!

// When someone clicks on a filter
$( '.filter-item').on( 'click', function(){
    var filter_name = $( this ).text();

    // Create a new clone for the slider items
    var $new_slider = $slider_clone.clone( true, true );

    // Clear current slider
    $slider.slick( 'unslick' ); // Remove slick
    $slider.empty(); // Remove elements

    // Show only filtered items
    if( filter_name == "All" ) {
        $slider.append( $new_slider.find( '.project-item-wrapper' ) );
    } else {
        $slider.append( $new_slider.find( '.project-item-wrapper.' + filter_name ) );
    }

    // Slick slider init or call your function that does it like I do
    init_projecten_slider();
});

basepack on 15 Apr 2016

👍3

Hello guys! Same issue here.
Do you know of any good workaround for this?

I´ve tried this code posted by @cannect, but didnt work for me.

In the other thread #1350 (same issue), they said something about using :even to filter... But I have no clue for what this means.

Can you help me?

Thank you!