Combining retrieved values with javascript and jquery [duplicate]

Question

Possible Duplicate:
How do I Convert a String into an Integer in JavaScript?

I have a select element that contains options for products. What I want to achieve is when they pick an option the price on the page automatically adjusts. I have figured out how to retrieve those values but when I combine them it just puts two numbers together instead of actually adding them.

For example instead of outputting 60 when I have 50 + 10 it outputs 5010.

My code:

$('.product_options').change(function(){
var base_price = $('#base_price').html();
var add_price = $(this).find("option:selected").data('price');

var new_price = base_price+add_price;

console.log(new_price);

$('.current_price').html(base_price+add_price);

});

Is there a way I can convert them both to integers so the operation actually goes through?

Thanks in advance!

You can use some tricks like multiplying by 1 to force a number cast or you can use parseInt() — TheZ
– TheZ, Commented Nov 14, 2012 at 21:07

Anoop · Accepted Answer · 2012-11-14 21:07:18Z

5

Use parseInt

$('.product_options').change(function(){
var base_price = parseInt($('#base_price').html(), 10); // 10 as second argument will make sure that base is 10.
var add_price = parseInt($(this).find("option:selected").data('price'), 10);

var new_price = base_price+add_price;

console.log(new_price);

$('.current_price').html(base_price+add_price);
});

answered Nov 14, 2012 at 21:07

Anoop

23.2k10 gold badges65 silver badges79 bronze badges

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

Comments

Billy Moon · Accepted Answer · 2012-11-14 21:21:21Z

1

Try:

var base_price = +$('#base_price').html();
var add_price = +$(this).find("option:selected").data('price');

See the mighty: Mozilla's Arithmetic Operators Reference - Unary Negation

edited Nov 14, 2012 at 21:21

Billy Moon

58.9k27 gold badges148 silver badges244 bronze badges

answered Nov 14, 2012 at 21:07

Matt Burland

45.3k18 gold badges110 silver badges182 bronze badges

2 Comments

Billy Moon Over a year ago

I had no idea..! Does this work on all browsers?

Matt Burland Over a year ago

@BillyMoon: It's part of the EMCAScript specification.

Billy Moon · Accepted Answer · 2012-11-14 21:08:40Z

0

Any values you pull out of the DOM are going to be strings, and need converting into number types before you can do mathematical operations with them.

parseInt( ... ) is a built in javascript function that converts a string into an integer, if the string consists of digits only.

If you need a decimal number, you can use parseFlaot.

var new_price = parseInt(base_price)+parseInt(add_price);
// new_price is now set to the sum of `base_price` and `add_price`

answered Nov 14, 2012 at 21:08

Billy Moon

58.9k27 gold badges148 silver badges244 bronze badges

Comments

Sanjay Kamaruddin · Accepted Answer · 2012-11-14 21:09:27Z

0

Use parseFloat or parseInt

$('.product_options').change(function(){
  var base_price = $('#base_price').html();
  var add_price = $(this).find("option:selected").data('price');

  var new_price = parseFloat(base_price) + parseFloat(add_price);

  console.log(new_price);

  $('.current_price').html(base_price+add_price);
});

answered Nov 14, 2012 at 21:09

Sanjay Kamaruddin

961 bronze badge

Comments

Silvester · Accepted Answer · 2012-11-14 21:10:08Z

0

Yes there is.

intval = parseInt(string)

is what you're looking for.

answered Nov 14, 2012 at 21:10

Silvester

5161 gold badge3 silver badges14 bronze badges

Collectives™ on Stack Overflow

Combining retrieved values with javascript and jquery [duplicate]

5 Answers 5

Comments

2 Comments

Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

2 Comments

Comments

Comments

Comments

Linked

Related