Actions on Custom Events

1

Are we able to watch for custom events?

I have a Zurb-foundation slider in a controller template. I want to trigger an action when it changes. Adding an action to the attached hidden input doesn’t work, presumably because foundation’s JS is intercepting it. So i’d like to watch the sliders change event, which is

changed.zf.slider

Can I do that somehow?

2

Stimulus does support custom events as actions:

<div class="slider" data-action="changed.zf.slider->controller-name#actionName"></div>

jQuery events are not supported though. If Zurb uses jQuery you have to delegate the events as custom events. I wrote about that in a previous post: Listening to jQuery events on Stimulus actions like `ajax:success`

3 Likes
3

Ok, thanks that is helpful. I think Zurb is using jQuery so Ill try that out.

1 Like
4

This worked btw: Your delegator + This snippet of Coffeescript:

delegate 'moved.zf.slider', parameters: ['event']

And then
<div class="slider visits-slider" data-action="jquery:moved.zf.slider->provision#update">

thanks for your help.

1 Like