CODEWITHSUNDEEP
javascript
cole
cole

Reputation: 320

Error when calling JavaScript function — "can't find variable"

I'm attempting to complete and exercise from the JavaScript Bible, and am having trouble getting my script to function.

The assignment is to create a page that allows users to query a planet's name, and, via a script that matches the planet's name with its data stored in the associate arrays, call up its distance and diameter information.

I'm attempting to call the function 'getPlanetInfo' via a button (onclick='getPlanetInfo()'). However, my error console reports that it cannot find a variable named 'getPlanetInfo' when I attempt to run it.

I've attached both my JS and HTML code below. Any idea as to why my function isn't being properly called would be hugely appreciated.

HTML:

<!DOCTYPE html>
<html>
<head>
    ...
    <script type="text/javascript" src="planets.js"></script>
</head>
<body>
        <h1>Check a planet's distance from the sun and its diameter!</h1>
        <form>
            <input type="text" name="entry" id="entry">
            <input type="button" value="Check it!" onClick="getPlanetInfo()">
        </form>
</body>
</html>

JS:

var planetNames = new Array(4);
planetNames[0] = "Mercury";
planetNames[1] = "Venus";
planetNames[2] = "Earth";
planetNames[3] = "Mars";

var planetDistances = new Array(4);
planetDistances[0] = "36 million miles";
planetDistances[1] = "67 million miles";
planetDistances[2] = "93 million miles";
planetDistances[3] = "141 million miles";

var planetDiameters = new Array(4);
planetDiameters[0] = "3,100 miles";
planetDiameters[1] = "7,700 miles";
planetDiameters[2] = "7,920 miles";
planetDiameters[3] = "4,200 miles";

function getPlanetInfo()
{
var selectedPlanet = document.getElementById("entry").value;
for (var i = 0; i < planetNames.length; i++)
{
    if (planetNames[i] == selectedPlanet)
    {
        break;
    }
}

if (i < planetNames.length)
{
    alert(selectedPlanet + " is " + planetDistances[i] " in distance from the Sun and " + planetDiameters[i] + "in diameter.")
}

else
{
    alert("Sorry, " + selectedPlanet + " isn't in the database.");
}
}

Upvotes: 6

Views: 14620

Answers (2)

Marcelo Diniz
Marcelo Diniz

Reputation: 2499

This line:

alert(selectedPlanet + " is " + planetDistances[i] " in distance from the Sun and " + planetDiameters[i] + "in diameter.")

is missing a + sign after planetDistances[i], so the function has a syntax error and is not created, and naturally it's not found when called.

http://www.jsfiddle.net helps you create a reproducible case that we can all see, use it when you need to ask js questions.

Upvotes: 2

James M
James M

Reputation: 16718

You're missing a + - this:

alert(selectedPlanet + " is " + planetDistances[i] " in distance from the Sun and " + planetDiameters[i] + "in diameter.")

should be

alert(selectedPlanet + " is " + planetDistances[i] + " in distance from the Sun and " + planetDiameters[i] + "in diameter.")

You should use something like Firebug to catch syntax errors when loading your script.

Upvotes: 0

Related Questions