umbriel
umbriel

Reputation: 751

jQuery detect when total value of counters are 0

I have a slight problem that I do not know how to approach due to my lack of Javascript experience. Basically I have two or more counters that each count upwards or downwards separately. I want to run a function when all of the counters total value equals to 0 But I do not know how to extract that value from the functions that someone wrote for me.

Here is a jsFiddle for the counters http://jsfiddle.net/RoryMcCrossan/puJ6G/1015/


jQuery(document).ready(function () {
$('.qtyplus').click(function (e) {
    e.preventDefault();
    var $container = $(this).closest('.count-container');
    var $field = $container.find('input[name=' + $(this).data('field') + ']');
    var currentVal = parseInt($field.val(), 10);
    if (!isNaN(currentVal)) {
        $field.val(currentVal + 1);
    } else {
        $field.val(0);
    }
});

$(".qtyminus").click(function (e) {
    e.preventDefault();
    var $container = $(this).closest('.count-container');
    var $field = $container.find('input[name=' + $(this).data('field') + ']');
    var currentVal = parseInt($field.val(), 10);
    if (!isNaN(currentVal) && !currentVal == 0) {
        $field.val(currentVal - 1);
    } else {
        $field.val(0);
    }
});

});

Many thanks! :)

Upvotes: 1

Views: 51

Answers (1)

James Donnelly
James Donnelly

Reputation: 128791

Firstly we can write a new function which checks all our counters and adds their values together:

function checkCounters() {
    var result = 0;

    // Loop through each "qty" input element        
    $('.qty').each(function() {
        // Add the value of the input to our result
        result += +this.value;
    });

    if (result === 0)
        // Your function should be triggered here
        console.log("Result is 0");
    else
        console.log("Result isn't 0, result is " + result);
}

We can then call this function whenever we update the value of a counter:

...
if (!isNaN(currentVal)) {
    $field.val(currentVal + 1);
} else {
    $field.val(0);
}
checkCounters();

JSFiddle demo.

Upvotes: 1

Related Questions