CODEWITHSUNDEEP
javascripthtml
Billie
Billie

Reputation: 9146

How to treat input field value as a number?

I have this very basic calculator:

<html>
    <body>
        <form name="form">
            <input type="text" name="num1" />
            <input type="text" name="num2" />
            <input type="text" name="res" />
            <input type="button" value="+" onclick="form.res.value = form.num1.value + form.num2.value" />
        </form>
    </body>
</html>

But it treats form.num1.value and form.num2.value as string and because of it the result is the concatenation of these values instead of addition.

How to treat them as numbers?

Upvotes: 2

Views: 4030

Answers (4)

Poetro
Poetro

Reputation: 572

Convert them to numbers with the + operator or parseFloat.

Upvotes: 1

bfavaretto
bfavaretto

Reputation: 71918

Shortest way is the unary plus operator, which converts to Number:

+form.num1.value + +form.num2.value

Note: it will return NaN for mixed inputs like "10 potatoes". To avoid that, you can use parseInt or parseFloat.

Upvotes: 2

Shryme
Shryme

Reputation: 1570

Try to convert them to number like this:

onclick="Numberform.res.value = Number(form.num1.value) + Number(form.num2.value)"

Upvotes: 1

Daniel A. White
Daniel A. White

Reputation: 190945

Wrap each value in a parseInt(value, 10) or parseFloat(value).

Upvotes: 6

Related Questions