Check the state before changing slide in Slick Slider
I am using this popular carousel ( http://kenwheeler.github.io/slick/ ).
I have placed some elements inside each slide. At least one of these items must be selected by the user before moving to the next slide. But I can't figure out how to prevent the user from manually navigating to the next slide by clicking the "next" arrow before selecting an item.
I know the "next / previous" arrows can be turned off, but I don't want to, as the user can go back to the previous slide to change the option.
I know one option is to turn off the default arrows and enter my own previous / next arrows and then link the slide change functions to it and check the status. But it would be great if there was a built-in parameter in this slider (which I can't figure out), as it minimizes my efforts.
source to share
I made a quick modified version of Slick that allows you to check the status at the following: http://jsfiddle.net/alan0xd7/dhxhv5gg/
Basically the slider will only go further if it fnCanGoNext
returns true
.
I only added one line around line 700 on the fiddle. It doesn't handle things like clicking on "previous" when on the first slide, but you can probably work from here.
Since Slick is an open source project, don't be afraid to change the code and adapt it to suit your needs. Nice to see how things work behind the scenes.
Hope this helps!
source to share