Rails Foundation 6 range slider stuck

I used the example from foundation docs ("With inputs"-part) to add a horizontal range slider to my simple_form. The slider looks just fine but I am unable to move the knob of the slider. The knob is in fixed-position at the beginning of the slider-bar not in the position "28" which is stated as initial. slider image

The form part looks like this:

= simple_form_for invitation do |f|
  = f.input :email
  .row
    .small-10.columns
      .range-slider data-options=("display_selector: #days-off-count; initial: 28;") data-slider=""
        span.range-slider-handle role="slider" tabindex="0"
        span.range-slider-active-segment
    .small-2.columns
      input#days-off-count type="number" value="28"
  .row
    button.small(type='submit')= t('general.buttons.save')

My application.js requires foundation like this:

//= require jquery
//= require jquery_ujs
//= require_tree .
//= require foundation

$(document).ready(function(){
  // front-end framework
  $(document).foundation
})

CSS is added as foundation_and_overrides.scss under my assets/stylesheets