How to get the text string from a form to append as a <li>

Question

I had to remove the triangle brackets for the li, since it hide the text when I tried using them.

I have a form with a submit button.

input class="text_box" type="text"/ button class="submit">Submit</button

I'm trying get the text from the form to append as a li when you click the submit button after entering text.

I was able to append li manually, but haven't figured out how to do this from the form.

$(".messages").append("liTest test1/li"); $(".messages").append("liTest test2 /li");

I have been able to trigger manual append when a user clicks submit, but can't figure out how to get the text from the textbox?

$(".submit").click(function (){ $(".messages").append("liYO/li");})

I could really use some help with this

Answer 1 · 2014-05-16T13:06:32Z

May 16, 2014 1:06pm

To retrieve the value of a form field using jQuery you first select the form field then retrieve its value. In your example you have a text field with a class of text_box, so you can retrieve its value like this:

$('.text_box').val()

You might want to use an ID instead of a class on this element -- if you have more than one item on the page with the class text_box you could end up selecting text from the wrong text field.

Welcome to the Treehouse Community

Looking to learn something new?

Monkey D Luffy

Monkey D Luffy

How to get the text string from a form to append as a <li>

1 Answer

Dave McFarland

Dave McFarland