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 jQuery Basics (2014) Creating a Mobile Drop Down Menu Getting a value

Posted by Unsubscribed User
Unsubscribed User
8,884 Points

Confused why my code won't execute

Here is the code challenge:

Take a look at the app.js and preview. The aim of this application is to show what the user types in to the input field and preview it in the H1 tag. Almost all the code is there, there's just one thing missing. Retrieving the value from the input. I forgot how to do it. Could you finish it for me? Thanks!

I need to use .val(), but I'm unsure where to place it. I placed it after function updatePreview() and it still won't run correctly.

Can you please let me know what I'm doing wrong? Here is my code:

ā€‹//Select the input for the title for blog post. var $titleInput = $("#title");

//Select the preview h1 tag var $previewTitle = $("#titlePreview");

// Every second update the preview var previewTimer = setInterval(updatePreview, 1000);

function updatePreview().val() {
//Get the user's input var titleValue; //Set the user input as the preview title. $previewTitle.text(titleValue); }

Ary de Oliveira
Ary de Oliveira
28,298 Points 
var $titleInput = $("#title");
var $previewTitle = $("#titlePreview");
var previewTimer = setInterval(updatePreview, 1000);
function updatePreview(){  
var titleValue = $titleInput.val();
$previewTitle.text(titleValue);
}

9 Answers

Erwin Meesters
Erwin Meesters
15,088 Points
Erwin Meesters
Erwin Meesters
15,088 Points

You defined the title input field with var $titleInput = $("#title"); To get the value from the input field you can use the val() method. So $titleInput.val(); gives you the value. Put this behind the variable titleValue in the function. Your code will look like this:

//Select the input for the title for blog post.
var $titleInput = $("#title");

//Select the preview h1 tag
var $previewTitle = $("#titlePreview");

// Every second update the preview
var previewTimer = setInterval(updatePreview, 1000);

function updatePreview(){  
  //Get the user's input
  var titleValue = $titleInput.val();  // <-
  //Set the user input as the preview title. 
  $previewTitle.text(titleValue);
}
Unsubscribed User
Unsubscribed User
8,884 Points

Wow, can't believe I didn't notice that. Thank you for the help, Erwin Meesters!

Ivan A.
Ivan A.
9,627 Points
Ivan A.
Ivan A.
9,627 Points

Well, yeah. That helped. But it feels more and more frustrating - NOT GETTING it :( . 75%-90% of what the Andrew is telling I do get, but, when it comes to the "Real thing" - total blank... Let's hope it'll come to me with experience...

Ary de Oliveira
Ary de Oliveira
28,298 Points
Ary de Oliveira
Ary de Oliveira
28,298 Points

var titleValue = $titleInput.val();

Karolina Stachijuk
Karolina Stachijuk
3,024 Points
Karolina Stachijuk
Karolina Stachijuk
3,024 Points

Hi, why

$titleInput.val(titleValue);

is not correct?

Rafael silva
Rafael silva
23,877 Points

hey you need to add like this

var titleValue = $titleInput.val();

Ary de Oliveira
Ary de Oliveira
28,298 Points
Ary de Oliveira
Ary de Oliveira
28,298 Points

this way you can not find the variable title in system ... i have go challenge again with you try...

Ary de Oliveira
Ary de Oliveira
28,298 Points
Ary de Oliveira
Ary de Oliveira
28,298 Points

Challenge Task 1 of 1

Take a look at the app.js and preview. The aim of this application is to show what the user types in to the input field and preview it in the H1 tag. Almost all the code is there, there's just one thing missing. Retrieving the value from the input. I forgot how to do it. Could you finish it for me? Thanks!

var $titleInput = $("#title");
var $previewTitle = $("#titlePreview");
var previewTimer = setInterval(updatePreview, 1000);
function updatePreview(){  
var titleValue = $titleInput.val();
$previewTitle.text(titleValue);
}
Ary de Oliveira
Ary de Oliveira
28,298 Points
Ary de Oliveira
Ary de Oliveira
28,298 Points

$titleInput.val(titleValue); Bummer! There was an error with your code: ReferenceError: Can't find variable: titleValue

Karolina as I said, we could not find the variable, I suggest you watch the video, it will clarify the reason the term of variable ...

You have done well, continue training and learning ...

Nikola Najdovski
Nikola Najdovski
18,744 Points
Nikola Najdovski
Nikola Najdovski
18,744 Points

Don't understand why you have to add () after the .val?