Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Regular Coder
    Join Date
    Sep 2011
    Posts
    353
    Thanks
    39
    Thanked 0 Times in 0 Posts

    JavaScript sum does not work

    OK, I find it a little weird about the issue I am having. I do not know why it is like this. I have to sum meter with centimeter and the result is not good.

    Here are my HTML codes first:
    Code:
    <input type="number" id="met"/> 
    <input type="number" id="cen"/>
    The text box with the ID "met" is for meter and the one with ID "cen" is centimeter. Good!

    I want to add both and the result must be in meter. So I have to convert the centimeter to meter and I did this:

    Code:
    var m = document.getElementById("met").value;
    var c = document.getElementById("cen").value;
                    
    var con = c / 100; //Convert centimeter to meter
    var add = m + con; //Add both
    Unfortunately, the result is not good. If I add 1 meter to 0.74 meter I get 10.74 and not 1.74 instead. Why? Thank!

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,519
    Thanks
    3
    Thanked 507 Times in 494 Posts
    Code:
    var m = document.getElementById("met").value;
    var c = document.getElementById("cen").value;
                    
    var con = c / 100; //Convert centimeter to meter
    var add = m*1 + c / 100; //Add both * and / converts a string number into a true number
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #3
    Regular Coder
    Join Date
    Sep 2011
    Posts
    353
    Thanks
    39
    Thanked 0 Times in 0 Posts
    Thank it works.

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,081
    Thanks
    203
    Thanked 2,542 Times in 2,520 Posts
    This reveals a weakness in HTML5 coding

    <input type="number" id="met"/>
    <input type="number" id="cen"/>


    But even though the input type is required to be a number the entered value is still a string, just as it would be with an ordinary textbox. So 1 + 0.74 is concatenated to 10.74.

    You could as an alternative to m*1 have used

    var m = Number(document.getElementById("met").value);
    var c = Number(document.getElementById("cen").value);

    to convert the strings to numbers.

    In Javascript the + symbol is used both to add numeric values, and concatenate string values. But all values entered into a form textbox are strings unless/until converted to numbers by one of several methods.
    Last edited by Philip M; 06-14-2014 at 05:20 PM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • Users who have thanked Philip M for this post:

    angelali (06-15-2014)

  • #5
    Regular Coder
    Join Date
    May 2012
    Location
    France
    Posts
    224
    Thanks
    0
    Thanked 32 Times in 30 Posts
    Or simply :
    Code:
    var add = +m + c / 100;

  • Users who have thanked 007julien for this post:

    angelali (06-15-2014)


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •