CODEWITHSUNDEEP
javascriptjqueryjquery-uievents
R4VANG3R
R4VANG3R

Reputation: 415

Bind jquery ui event to local function

I'm busy building a javascript class to automate the creation of Jquery UI Sliders.

    CustomSlider.prototype.initialize = function(slider_id, min_id, max_id, step, min, max){
        this.$slider = $('#' + slider_id);
        this.$min = $('#' + min_id);
        this.$max = $('#' + max_id);
        this.min = min;
        this.max = max;
        this.step = step;

        this.$slider.slider({
            range: true,
            step: this.step,
            min: this.min,
            max: this.max,
            values: [(this.min + (step * 4)), (this.max - (step * 4))],
            slide: this.slide(event, ui)
        });

        this.$min.text(this.min + (step * 4));
        this.$max.text(this.max - (step * 4));
    };

    CustomSlider.prototype.slide = function(event, ui){
        this.$min.text(ui.values[0]);
        this.$max.text(ui.values[1]);
    };

When I try to bind the slide event it won't take the "event" and "ui" variables. How can I bind this event to my own function?

Upvotes: 0

Views: 134

Answers (1)

Arun P Johny
Arun P Johny

Reputation: 388316

It should be just

    this.$slider.slider({
        range: true,
        step: this.step,
        min: this.min,
        max: this.max,
        values: [(this.min + (step * 4)), (this.max - (step * 4))],
        slide: this.slide
    });

You need to assign the function reference as the value for slide property.

In your case you are calling the this.slide function as assigns the value returned by it to the slide property, in this case undefined

Upvotes: 3

Related Questions