循环属性中的javascript sum值

Question

I have 2 types of rows (Basic and Extra). I need SUM of input values group by attribute "data-type"

<div class="row-item" data-type="Basic"><input type="number" value="2" class="number-input"></div>
<div class="row-item" data-type="Basic"><input type="number" value="5" class="number-input"></div>
<div class="row-item" data-type="Basic"><input type="number" value="3" class="number-input"></div>
<div class="row-item" data-type="Basic"><input type="number" value="4" class="number-input"></div>
<div class="row-item" data-type="Extra"><input type="number" value="3" class="number-input"></div>
<div class="row-item" data-type="Extra"><input type="number" value="5" class="number-input"></div>

and I need ie object of arrays:

Basic => sum : 14,
Extra => sum : 8

I tried something but it does not works ...

data = {};
$(".row-item").each(function (index, elem) {

    var type = $(elem).data('type');
    count = $(elem).find(".number-input").val();
    sum += count;

    data[type] = {
        sum: sum
    };
});

Answer 1

You can use data-type values in selector to select specific value.

var basic = 0;
$('.row-item[data-type="Basic"]').each(function () {
    basic += parseInt($(this).find('input').val(), 10) || 0;
});


var extra = 0;
$('.row-item[data-type="Extra"]').each(function () {
    extra += parseInt($(this).find('input').val(), 10) || 0;
});

alert(basic + ' ' + extra);

Demo: http://jsfiddle.net/tusharj/773va00j/

EDIT

var obj = {
    Basic: 0,
    Extra: 0
};

$('.row-item[data-type]').each(function () {
    obj[$(this).data('type')] += parseInt($(this).find('input.number-input').val(), 10);
});

console.log('Basic ' + obj.Basic);
console.log('Extra ' + obj.Extra);

Demo: http://jsfiddle.net/tusharj/773va00j/1/

Answer 2

Another approach would be the following. This would also allow you to have more types if need be.

 var data = {}; $(".row-item").each(function(index, elem) { var type = $(elem).data('type'); var count = parseInt( $(elem).find(".number-input").val(), 10 ); if (data.hasOwnProperty(type)) { data[type]["sum"] += count; } else { data[type] = {"sum": count}; } }); alert (JSON.stringify(data, null, 4)); //console.log(data); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="row-item" data-type="Basic"><input type="number" value="2" class="number-input"></div> <div class="row-item" data-type="Basic"><input type="number" value="5" class="number-input"></div> <div class="row-item" data-type="Basic"><input type="number" value="3" class="number-input"></div> <div class="row-item" data-type="Basic"><input type="number" value="4" class="number-input"></div> <div class="row-item" data-type="Extra"><input type="number" value="3" class="number-input"></div> <div class="row-item" data-type="Extra"><input type="number" value="5" class="number-input"></div>