CODEWITHSUNDEEP
jqueryjquery-ui
udexter
udexter

Reputation: 2347

Cancel the change event of a jQuery UI Slide

I have the next piece of code:

    $("#slider-cpu").slider({
        range: "min",
        value: 0,
        min: 0,
        max: cpu.length - 1,
        slide: function(event, ui) {
            $("#cpu").html(cpu[ui.value]);
        },
        change: refreshPrice
    });

And 3 like that called slide-cpu, slide-ram and slide-hdd. That 3 sliders calls to refreshPrice() function and it work well, when it's changed the function is executed.

The problem is that I have a button to preset various values, exactly this:

    $(".preset").click(function(){
        var values = $(this).attr('data-item'),
            cpu = values[0],
            ram = values[2],
            hdd = values[4];

        $("#slider-cpu").slider("value", cpu);
        $("#slider-ram").slider("value", ram);
        $("#slider-hdd").slider("value", hdd);
    });

This codes does exactly what I wanted, change the values with the new ones. The problem is that in every call of slider("value", item) change is called and refreshPrice() is called 3 times (and it does an ajax call).

I have tried to do .slider("value", cpu).slider("change", function(){}); to reset the change option but it didn't work.

How I can do it?

Upvotes: 0

Views: 373

Answers (2)

Hogan
Hogan

Reputation: 70523

I would do something like this, change your function so you can turn it off

var pauseRefresh = false;

function refreshPrice() {
   if (pauseRefresh) return;

   // existing code
}

$(".preset").click(function(){
    var values = $(this).attr('data-item'),
        cpu = values[0],
        ram = values[2],
        hdd = values[4];

    pauseRefresh = true;

    $("#slider-cpu").slider("value", cpu);
    $("#slider-ram").slider("value", ram);
    $("#slider-hdd").slider("value", hdd);

    pauseRefresh = false;

    refreshPrice();
});

Upvotes: 1

Andrew
Andrew

Reputation: 13853

If you just want refreshPrice to be called after the user slides the slider, bind it to stop instead. That fires after the user finished moving the slider around.

Upvotes: 1

Related Questions