I have a problem with a javascript string to number conversion

Question

0.00/5 (No votes)

See more:

I am experimenting with dates and i found out the values from a date type input
are strings. I want to convert the number parts of the string that is returned, to numbers.
I suppose the best way to describe what i am trying to do is by pasting in the code.

here is the relevant HTML code

<input id="dateinput" type="date"> </input>
<input type="button" onclick="calcdiff()" value="submit"> </input>

Here is my javascript code. the ctc element is where i test to see if i get the correct output.

function calcdiff() {
var datetest = document.getElementById("dateinput").value;
  var yearString = datetest.slice(0,4);
  var monthString = datetest.slice(5,7);
  var dayString = datetest.slice(8,10);
var yearNum = Number("yearString");
var monthNum = Number("monthString");
var dayNum = Number("dayString");
document.getElementById("ctc").innerHTML = yearNum;

What I have tried:

when i use typeof yearNum, i can see it is converted to a number type. However,
when i just set the innerHTML to yearNum as in the code above, it returns "NaN".
That is even though if i set the ctc element to display yearString, it displays "2018", if that is the year i choose from the date input element.

What is wrong with the code since it returns "NaN" and not the number?

Posted 11-Jul-18 17:01pm

Zigning

Updated 11-Jul-18 17:11pm

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Bryian Tan · Accepted Answer · 2018-07-11T17:11:00

The correct syntax should be

JavaScript

var yearNum = Number(yearString);
  var monthNum = Number(monthString);
  var dayNum = Number(dayString);

and not Number("yearString"); because it try to convert the string "yearString" into number. Very minor changes, pass in the yearString variable.

By the way, those input elements closing tag look a little odd. it should be

HTML

<input id="dateinput" type="date"/>
<input type="button" onclick="calcdiff()" value="submit"/>