FAQ: Learn HTML: Forms - Text Input

This community-built FAQ covers the “Text Input” exercise from the lesson “Learn HTML: Forms”.

Paths and Courses
This exercise can be found in the following Codecademy content:

Introduction to HTML

FAQs on the exercise Text Input

There are currently no frequently asked questions associated with this exercise – that’s where you come in! You can contribute to this section by offering your own questions, answers, or clarifications on this exercise. Ask or answer a question by clicking reply (reply) below.

If you’ve had an “aha” moment about the concepts, formatting, syntax, or anything else with this exercise, consider sharing those insights! Teaching others and answering their questions is one of the best ways to learn and stay sharp.

Join the Discussion. Help a fellow learner on their journey.

Ask or answer a question about this exercise by clicking reply (reply) below!

Agree with a comment or answer? Like (like) to up-vote the contribution!

Need broader help or resources? Head here.

Looking for motivation to keep learning? Join our wider discussions.

Learn more about how to use this guide.

Found a bug? Report it!

Have a question about your account or billing? Reach out to our customer support team!

None of the above? Find out where to ask other questions here!

1 Like

Does anyone know what the instructions are supposed to be for this exercise? For me, all three steps say “Blank instructions placeholder”… so I cannot satisfy the aims of the instruction in order to proceed further.

I reported a bug, and will wait to see if this is resolved, but I was hoping that perhaps someone else was able to view them properly as I hoped to progress further over the weekend.

Thanks in advance for your help!

10 Likes

Well, that wasn’t too hard: by experimenting, I was able to determine the required code for this step.

If you are stuck like I was, with blank instructions, here’s what is required to proceed:

  • A text element
  • Named “username”
  • With default value “Davie”
12 Likes

Yes. I hope that will get fixed :no_mouth:

@sonnynomnom There is no instruction-can you fix this please?

3 Likes

i passed this along to kenny from our web dev path team and it should be fixed!

2 Likes

Yes! Thank you Sonny!

Is “text” the only value for type attribute? Or do we have any other values?Please Explain.

What is the difference between name= and id= in the input tag? Are they different sometimes?

2 Likes

Why does ‘input’ seemingly not require a closing tag?

Also in the lesson I was a bit confused regarding the “value” attribute, it’s mentioned before the first screenshot example, but doesnt appear in the screenshot, only type and name are shown as attirbutes for the .

I understand (as it’s explained further down) that value is tied to the name attribute, I just found it a little confusing at first to see it mentioned, but not shown in the initial example screenshot.

So far though, absolutely loving the lesson structure, keep up the great work!

2 Likes

I know this is 24 days late so you probably have the answer, but I was confused as well and this lesson seems to be useful and timeless. It seems the doesnt require a closing tag for the same reason doesn’t, as it’s just placing the box/picture there.

1 Like

<input> is among those few that we call void elements, named so because they do not enclose content in a wrapper the way <p></p> and all the other content sectioning tags do.

Self-closing tags contain their data in attributes which are properties of that element object. The value attribute takes all the user input from the keyboard and on Submit, packages it with the name given in the name attribute for that content.

7 Likes

I noticed that if I press enter while my cursor is in the input, the url changes to

https://localhost/?username=

where is whatever I have typed in the input box. When I tried changing the url to

https://localhost/?username=Testing

I had expected that the page would load with the input box having a value of “Testing”, but this was not the result.

What exactly is going on here?

After further experimenting, I noticed something which seems to be a bug: After changing the input element to have no predefined value

<input type="text" name="username">

and then clicking the refresh button on the browser panel, the page still loaded with “Davie” appearing in the input box. Is this unintended behavior or am I missing something here?

If the described behavior is unclear, here is a gif to illustrate: https://gyazo.com/06decf8bb6d9d7c313b8709bd6450ebb

1 Like

They are different in that id is used to assign a unique name to an element which will then be worked with CSS code, for example. While name is an attribute specific to some elements, like the <form> element and is used to have a name to assign the input value to.

More here: https://stackoverflow.com/questions/1397592/difference-between-id-and-name-attributes-in-html

1 Like

Hello, Im new in this and I have a question. Why does the element hasn’t a closing tag?

Thank you.

Hi :slight_smile:

In normal HTML elements, we put content between the start and end tag. But in case of some elements, it does not make sense for them to have any content. For example, let’s take a look at <br> element - this element produces a line break… and that’s it. It’s really hard to imagine how content inside the line break could be rendered, right? :slight_smile:

Another example - <hr> element - this element represents a paragraph-level thematic break which is usually visually represented in the form of a horizontal line (like the one below this paragraph). And again, it simply does not make any sense for this element to have any content.


And the same goes for <input> element. What could be the content of this element? Ok, it got value, but the value is based on the input from the user so it belongs to the attribute, it’s not really content.

In HTML5 elements that can’t have any content are known as Void elements, there are only a few void elements: area, base, br, col, embed, hr, img, input, link, meta, param, source, track, wbr.

Void elements only have a start tag; end tags must not be specified for void elements. Sometimes you can find code that looks like this:

<input type="text" value="hello" name="hello" />

The /> is sometimes referred to as a self-closing tag, but this is incorrect. / does not mean anything in HTML5 (except for foreign elements, which are rather uncommon) and does not change anything, it can be omitted.

2 Likes

Would this not also apply to HTML5 served as XML? It must conform to XHTML, as I understand it, though in HTML5 the space preceding the slash is optional.

1 Like

In XHTML there are self-closing tags, no void elements (different mechanics). So the / or a full end tag (<br/> will be treated as <br></br>) would be necesarry in XHTML. So to maintain compatibility with XHTML you would have to use /.

But today there are not really many reasons to care for compatibility with XHTML. There are many differences between XHTML and HTML5 (for example named character references, attributes without values), trying to provide compatibility when you don’t really need it is just a waste of time.


I strongly advocate to not call void elements self-closing. In my opinion, this makes it a lot easier to understand what is going on when we use foreign elements (that might be truly self-closing) - for example from the SVG namespace. It would be so confusing to say:

  • img is a self-closing element, you can add /, but it is not required, you cannot add </img> tag
  • circle in SVG namespace is a self-closing element, you have to add / or </circle> tag

:slight_smile:

3 Likes

quick question, does inputting a value for the value tag change the code after it is submitted. cause in the first code there was no value attribute, but the next one seems to have acquired one, which got me thinking if input from the UA can alter the source code in anyway.

It is okay to assign a default to the value attribute. It can be overwritten by the user if that value is not what they wish to submit.

I tried it out, it seems that the input element can include both the name and the id attributes. Can anyone please tell me why this happens? Shouldn’t the name attribute be enough to give the input element a unique identity?