Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Build an Interactive Website Form Validation and Manipulation Text Input Events

Neslee Rodillo
Neslee Rodillo
19,615 Points
Posted by Neslee Rodillo
Neslee Rodillo
19,615 Points

I don't understand the error I receive from this task: Form Validation and Manipulation Challenge Task 1 of 2

I have watched the video a number of times but do not understand where I am going wrong with relation to the code challenge:

Question - Challenge Task 1 of 2

Hide all elements with the class of 'hint'.

My Solution- 

<!DOCTYPE html>
<html>
<head>
    <title>Text Input Events</title>
</head>
<body>

    <p>
        <input type="text"><span class="hint">Type in something cool</span>
    </p>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="app.js">
  $('.hint').hide();
  </script>
</body>
</html>

Error message I receive - Bummer! There was an error with your code: TypeError: 'undefined' is not an object (evaluating '$.calls.jQuery.length')

3 Answers

Colin Bell
Colin Bell
29,679 Points
Colin Bell
Colin Bell
29,679 Points

Dont put code between script tags that are loading an external script file.

either put the code in the app.js file itself

app.js 
$('.hint').hide()

or create a new script tag, without the src attribute, after the app.js script tag.

index.html 
<!DOCTYPE html>
<html>
<head>
    <title>Text Input Events</title>
</head>
<body>

    <p>
        <input type="text"><span class="hint">Type in something cool</span>
    </p>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="app.js"></script>

<!-- Make sure to add after the file is loaded -->
<script>
  $(".hint").hide();
</script>

</body>
</html>
shezazr
shezazr
8,275 Points
shezazr
shezazr
8,275 Points

whats your JQuery code?

Also '$.calls.jQuery.length seems wrong usually it is something like: $(".calls").

Gareth Borcherds
Gareth Borcherds
9,372 Points
Gareth Borcherds
Gareth Borcherds
9,372 Points

There are two tabs for the code challenge. The app.js file is open in another tab. And as they stated above, you'll just need to put $('.hint').hide(); in the app.js file to pass the challenge.