How to append numbers into input field using Javascript

Question

I'm trying to build a calculator using javascript (Trying to advance my skills) and I ran into an issue with trying to add more than one number to the input field(The area where the numbers should show).

$('.Buttons').click(function() { 
    var getValue = this.value;
    if($('#Result').is(':empty')) {
        document.getElementById('Result').value = getValue
    }
    else {
       /* document.getElementById('Result').appendChild(document.createTextNode(getValue)); */
       resultBox = $("#Result").value + getValue
    }
});

Should I use a <div> as the input and simply used the .innerHTML method to change it instead? Sorry if I sound noobish, I just took a javascript test was rated mediocre -_- :( So I'm going to practice Javascript more often now.

document.getElementById('Result').value = document.getElementById('Result').value + getValue; — Asif Mehmood
– Asif Mehmood, Commented Jan 21, 2016 at 15:34
Are you just appending digits here? e.g. the buttons each have a number? — iCollect.it Ltd
– iCollect.it Ltd, Commented Jan 21, 2016 at 15:43
@TrueBlueAussie Yes, each button has a value of the number assigned. I want to perform operations with them once entered — Jamell Daniels
– Jamell Daniels, Commented Jan 21, 2016 at 15:59
That makes more sense now. Please provide sample HTML next time too :) If you want to use decimal values, convert using Number() and not parseFloat(). It will convert blank strings to 0 (which is better for your calculator) — iCollect.it Ltd
– iCollect.it Ltd, Commented Jan 21, 2016 at 16:00

Sabaz · Accepted Answer · 2016-01-21 15:38:37Z

1

Something like this should work fine if you need to append the new pressed number to the "display" field

$('.Buttons').click(function() { 
    document.getElementById('Result').value += ''+this.value;
});

answered Jan 21, 2016 at 15:38

Sabaz

5,3722 gold badges21 silver badges26 bronze badges

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

4 Comments

iCollect.it Ltd Over a year ago

Why mix raw selectors with jQuery? Be a lot shorter in jQuery only.

Jamell Daniels Over a year ago

This worked! However, TrueBlueAussie was saying that the value was being viewed as a string rather than a number. would I use the number function to change that?

Sabaz Over a year ago

@JamellDaniels no if you only need to append more numbers to the input field. you have to convert to numbers your values if you need to make some operations with them

Mike Cluck Over a year ago

@JamellDaniels Use parseInt or parseFloat to convert strings to numbers.

Collectives™ on Stack Overflow

How to append numbers into input field using Javascript

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related