Filterrific, trigger submitFilterForm on event from another lib

Question

I'm using Foundation 6 and Filterrific gem in a Rails project. I'd like to trigger the following:

$(document).on('changed.zf.slider', Filterrific.submitFilterForm);

'changed.zf.slider' is the event that Foundation emits. Filterrific.submitFilterForm is the function I'd like to call. However, it doesn't work even if I bind to the event like this:

$(document).on('changed.zf.slider', function() { Filterrific.submitFilterForm() });

The code above is defined AFTER Filterrific code is loaded in the browser.

Is this an issue with Filterrific jquery code or should I use a different method for binding to event?

It works fine if I simply copy the original Filterrific.submitFilterForm method body to my binding like

$(document).on('changed.zf.slider', function() {
  var form = $("#filterrific_filter"),
      url = form.attr("action");
      $.ajax({...

... but it feels like it's not the way to go right? ;)

Answer 1

The tricky thing here is that Filterrific.submitFilterForm depends on this context passed to it and looks for the parent <form> element.

So you need to call the function with a right context, e.g.:

$(document).on('changed.zf.slider', function() {
  Filterrific.submitFilterForm.call($('#filterrific_filter .slider'))
});