jQuery create array of input options and add them together

Question

I got some select inputs where I need to create an array of their current selected val. I then need to get these values added together.

My HTML:

<select class="selectName" name="Select options" id="options1">
    <option value="5.0000">10x4</option>
    <option value="20.0000">10x8</option>
</select>

<select class="selectName" name="Select options" id="options2">
    <option value="5.0000">10x4</option>
    <option value="20.0000">10x8</option>
</select>

So far, I can get the current option:selected value by doing:

optionsTotal = $.map($(".selectName").find('option:selected'), function (el, i) {
   return $(el).val();
});

How can I add these values together to get a total? I just want the selected options total.

Here is a fiddle: http://jsfiddle.net/vdecree/e9zxY/34/

possible duplicate of Sum of values in an array using jQuery — Ram
– Ram, Commented Apr 9, 2014 at 14:33
Yeh that was my bad when i wrote the question, my actual site doesn't have duplicates! — Gerico
– Gerico, Commented Apr 9, 2014 at 14:40

T McKeown · Accepted Answer · 2014-04-09 14:29:35Z

0

function getOptionsPrice() {

var optionsTotal = null;

function init() {
    $(".selectName").on('change', function() {

        optionsTotal = new Number(0);
        $.map($(".selectName").find('option:selected'), function (el, i) {
            var v = new Number( $(el).val());
            optionsTotal += v;
        });

        $(".result").text(optionsTotal);

    }).change();
}

  init();
  return optionsTotal;
}

getOptionsPrice();

answered Apr 9, 2014 at 14:29

T McKeown

12.9k1 gold badge27 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Amit Joki · Accepted Answer · 2014-04-09 14:26:42Z

0

I think you need this:

var optionsTotal = 0;
$(".selectName > option:selected").each(function(){
    optionsTotal += Number($(this).val());
});

BTW, you can't have duplicate IDs.

answered Apr 9, 2014 at 14:26

Amit Joki

59.4k7 gold badges80 silver badges96 bronze badges

Comments

Rao Ehsan · Accepted Answer · 2014-04-09 14:36:57Z

0

Use parseFloat() inside $.map() and use clouser for optionsTotal function getOptionsPrice() { var optionsTotal = 0;

function init() {
    $(".selectName").on('change', function() {
        optionsTotal = 0;
        $.map($(".selectName").find('option:selected'), function (el, i) {
            optionsTotal += parseFloat($(el).val());
        });

        $(".result").text(optionsTotal);

    }).change();
}

init();
return optionsTotal;
}

getOptionsPrice();

Here is DEMO

answered Apr 9, 2014 at 14:36

Rao Ehsan

7768 silver badges15 bronze badges

Comments

Dhanasekar Murugesan · Accepted Answer · 2014-04-09 14:38:07Z

0

Define a variable to hold the total and using $map() iterate through the dropdowns with selected options added upon that total variable as in:

var sum=0;
 $.map( $('.selectName').find('option:selected'),
                          function(el){
                        sum += parseFloat($(el).val());
     });

     console.log(sum);

answered Apr 9, 2014 at 14:38

Dhanasekar Murugesan

3,2591 gold badge21 silver badges23 bronze badges

Comments

user1846747 · Accepted Answer · 2014-04-09 14:41:30Z

0

function getOptionsPrice() {

function init() {
    $(".selectName").on('change', function() {
        var optionsTotal = 0.0;
        $.map($(".selectName").find('option:selected'), function (el, i) {

            optionsTotal += Number($(el).val());
            return optionsTotal;
        });
        $(".result").text(optionsTotal);

    }).change();
}

init();
return optionsTotal;

}

getOptionsPrice();

Working JSFiddle... Check this out...

answered Apr 9, 2014 at 14:41

user1846747

Collectives™ on Stack Overflow

jQuery create array of input options and add them together

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related