How to detect slider change?

[danyj]

I am trying to detect slider option change in different option

The first log here triggers fine but the change is not detected

(function ($, fwEvents) {

    fwEvents.on('fw:options:init', function (data) {

        var $range = $("#fw-option-get_styles-base-tm_tl_height input");

        console.log( $range.val());

        $range.on("change", function() {

            console.log($(this).val());
        });

    });

})(jQuery, fwEvents);

Is it because of the hidden input?

I checked here Range slider onChange event listening http://ionden.com/a/plugins/ion.rangeSlider/demo_interactions.html

and it should work or is my option firing to early.

[ghost]

I am not familiar with ionRangeSlider. This seems to work:

jQuery(document.body).on(
    'change',
    '.fw-option-type-slider, .fw-option-type-range-slider', 
    function(){ 
        console.log(
            jQuery(this).find('input').val(),
            jQuery(this)
        );
    }
);

or in your code try to change

var $range = $("#fw-option-get_styles-base-tm_tl_height"); // ' input' removed

[ghost]

Also note that the 'fw:options:init' event is fired very often (on addable-box add, on options-modal open), not only once (like domready). The purpose of the fw:options:init event is to use/init data.$elements.

In your case better to use jQuery(function($){ ... });

[danyj]

Thank you!