jQuery trigger function on change

Posted by Michael Pasqualone on Stack Overflow See other posts from Stack Overflow or by Michael Pasqualone
Published on 2010-06-11T06:45:15Z Indexed on 2010/06/11 7:33 UTC
Read the original article Hit count: 142

Filed under:

I have the following two slider functions which work well and display like so: alt text

I have diskAmount and transferAmount stored in global vars, however what I am now trying to figure out is how do I get the sum of the two to initially show as the monthly fee, and then update when either of the two sliders are changed.

So in my screenshot above the initial state will be $24.75, and the fee will update if the sliders change.

Can anyone point me in the right direction? I get can the initial fee to show, but can't figure out how to get 1 function to call another function within jQuery.

$(function() {
        $("#disk").slider({
            value:3,
            min: 1,
            max: 80,
            step: 1,
            slide: function(event, ui) {
                $("#diskamount").val(ui.value + ' Gb');
                $("#diskamountUnit").val('$' + parseFloat(ui.value * diskCost).toFixed(2));
            }
        });
        // Set initial diskamount state
        $("#diskamount").val($("#disk").slider("value") + ' Gb');
        // Set initial diskamountUnit state
        diskAmount = $("#disk").slider("value") * diskCost;
        $("#diskamountUnit").val('$' + diskAmount.toFixed(2));

    });

    $(function() {
        $("#data").slider({
            value:25,
            min: 1,
            max: 200,
            step: 1,
            slide: function(event, ui) {
                $("#dataamount").val(ui.value + ' Gb');
                $("#dataamountUnit").val('$' + parseFloat(ui.value * transferCost).toFixed(2));
            }
        });
        // Set initial dataamount state
        $("#dataamount").val($("#data").slider("value") + ' Gb');
        // Set initial dataamountUnit state
        transferAmount = $("#data").slider("value") * transferCost;
        $("#dataamountUnit").val('$' + transferAmount.toFixed(2));      
    });

© Stack Overflow or respective owner

Related posts about jQuery