Javascript "variable is not defined"

Question

I am writing a simple javascript function that grabs information out of three text areas. Pretty basic, but for some reason javascript is telling me that my variables are not defined and I am confused as to why.

The html is as followed:

<input type = "text" id = "month" name = "month"/>
    <input type = "text" id = "day" name = "day"/>
    <input type = "text" id = "year" name = "year"/>
    <input type = "button" id = "submit" value = "Go!" onClick = "calculate(month, day, year)"/>

The javascript is simply

function calculate(month, day, year){
var setMonth = document.getElementById(month).value;
var setDay = document.getElementById(day).value;
var setYear = document.getElementById(year).value;}

And when I run this and click my button, it says "month is not defined" in Firebug. So I am a little confused, since ... they are defined!

Pekka · Accepted Answer · 2011-03-31 18:28:25Z

9

month, day, and year are interpreted as variable names, which don't exist. You want to pass strings:

onClick = "calculate('month', 'day', 'year')"/>

answered Mar 31, 2011 at 18:28

Pekka

451k150 gold badges989 silver badges1.1k bronze badges

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

Comments

Naftali · Accepted Answer · 2011-03-31 18:28:45Z

1

you did not define them: to do that you would do:

calculate('a', 'b', 'c');

in your case you need to change you code alot or change what your function does:

i would say do option 2:

onclick ="calculate(document.getElementById('month'), document.getElementById('day'), document.getElementById('year'));"

and the function to:

function calculate(month, day, year){
   var setMonth = month.value;
   var setDay = day.value;
   var setYear = year.value;
}

answered Mar 31, 2011 at 18:28

Naftali

147k41 gold badges247 silver badges304 bronze badges

3 Comments

Dave Over a year ago

I like your answer better than mine, but I think I would pass the value instead of calculating it in the function - that way, the function can be used for forms, or just passing it the numbers.

Naftali Over a year ago

@Dave i was just trying to keep sorta the same format the OP had already

Dave Over a year ago

completely understand. And like I said, I like your answer better than mine :) Just making notes in case the OP used yours - offering up a minor change.

Angelom · Accepted Answer · 2011-03-31 18:39:09Z

1

Notice that the calculate function does not have any arguments and that the document is queried based on the name of the fields.

HTML

<input type = "text" id = "month" name = "month"/>
    <input type = "text" id = "day" name = "day"/>
    <input type = "text" id = "year" name = "year"/>
    <input type = "button" id = "submit" value = "Go!" onClick = "calculate()"/>

Javascript

function calculate(){
var setMonth = document.getElementById('month').value;
var setDay = document.getElementById('day').value;
var setYear = document.getElementById('year').value;}

answered Mar 31, 2011 at 18:39

Angelom

2,5411 gold badge15 silver badges8 bronze badges

Comments

Dave · Accepted Answer · 2011-03-31 18:29:21Z

0

In the "onClick" portion of your html, you're attempting to send "month", "day", and "year" variables that have yet to be defined.

Instead of passing the variables, try just running the "calculate();" function, and getting the data from the form from within the function.

answered Mar 31, 2011 at 18:29

Dave

29.2k26 gold badges117 silver badges184 bronze badges

Comments

vvk · Accepted Answer · 2011-03-31 18:35:02Z

0

When you call a function you must pass parameters initiates

<input type = "text" id = "month" name = "month"/> <input type = "text" id = "day" name = "day"/> <input type = "text" id = "year" name = "year"/> <input type = "button" id = "submit" value = "Go!" onClick = "calculate(document.getElementById(month), document.getElementById(day), document.getElementById(year))"/>

Javascript code:

function calculate(month, day, year){ var setMonth = month.value; var setDay = day.value; var setYear = year.value;}

answered Mar 31, 2011 at 18:35

vvk

8235 silver badges16 bronze badges

Comments

Bouyaxhaka · Accepted Answer · 2011-12-05 13:30:58Z

0

if you want tu use the function $(document).ready(...)

you need to add in the <HEAD></HEAD> tag the folowing line:


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

answered Dec 5, 2011 at 13:30

Bouyaxhaka

1

1 Comment

Stephen Over a year ago

How does a question about javascript where there is no mention of jQuery result in this? And besides, you don't have to put your jQuery in the head, it is better to place it (and all other possible scripts) at the end of the page.

Collectives™ on Stack Overflow

Javascript "variable is not defined"

6 Answers 6

Comments

3 Comments

Comments

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Comments

3 Comments

Comments

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related