Codecademy Forums

FAQ: Learn HTML: Forms - Adding a Label

Community%20FAQs%20on%20Codecademy%20Exercises

This community-built FAQ covers the “Adding a Label” 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 Adding a Label

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!

In the first lesson of creating a form it’s said to add the POST method

Screenshot_20190123_162856

but thereafter during the exercises that line of code is not used, the form is defined just with an opening and closing form tag.

Am I missing something or is that an error in the lesson?

although the action and method attributes are very useful, and used a lot, the lessons however focuses purely on the form itself, so its bit redundant to add these attributes every time while we are not using them.

1 Like

In the examples: for= “meal”, name=“food”, id=“meal” I can’t figure out where food, meal and food came from. Am I reading too much into them?

you defined them, but as you can see meal is used in for attribute and id attribute. So now the label is associated with the input element

as for the name attribute, you will see it usage when you start processing forms.

Thanks for trying to answer my question but I don’t think I made myself clear. I know what they do but I don’t understand where the words meal and food come from. Were they just made up or are they on a list of definitions.

i answered that:

you can choice what names you see fit for attribute values, of course, it would make sense to pick something logical.

1 Like

image

It said when <label"> is clicked, the corresponding <input> will be highlighted/selected.
But nothing had happened,did I do something wrong?

i made a simple bin:

https://jsbin.com/jecocucoxi/edit?html,js,output

that seems to work fine, so just from a screenshot its difficult to see the problem.

1 Like

can someone explain to me whats the meaning of the svg behind the davies burger link.

SVG (scalable vector graphics) is an image format, just like .jpg and .png.

Would there be any problem if I set the same word for an id and a name attribute inside an <input>?
For example:

<label for="username">Username</label>
<input type="text" id="username" name="username">

Is this valid or will it cause any problem?

No, perfectly valid and quite common. In fact, if you inspect facebook (big company with good coding practice) email login field:

<input type="email" class="inputtext" name="email" id="email" data-testid="royal_email">

you see that name and id are the same, you see this a lot.

1 Like

Oh my god I didn’t think I would receive such a quick answer! thank you so much! great course and great web! I use to have such a hard time trying to learn any kind of programming, but this website is taking me places with web programming!

3 Likes

Why do we need to specify the name of the form we use when using labels, isn’t <label> just like a <p> ?

It is not like P in the true sectioning aspect since it applies to only a single INPUT.

<label for="id">ID</label> <input id="id">

or,

<label>ID <input></label>

Note that when the label wraps the input it does not require a for attribute. INPUT is a child of the element. When the two elements are sibling elements, we need to specify which input field the label applies to.

Why do we include <h1> and <p> elements in <form> element?
If we have <label> that determines context of <input> element, than what is the goal of<h1> and <p> elements in<form></form> part of the page?
Is it a bad idea to write header and paragraph before (and more independently) <form></form> element?

1 Like

Inside a form element, H1 and P are generally there to inform the user. They are not form controls, but signal the type of input expected.

LABEL is for individual form controls. They tell the user (and user agent) what that particular field is expected to contain. labels are not headings unless we view them in the specialized sense of the word.

1 Like

I think Interneting Is Hard gives us a good explanation of what SVG image format is like: https://internetingishard.com/html-and-css/links-and-images/#svg-images

I’m a little fuzzy on the verbiage here and hope someone can help me understand it a little better.

 <label for="username">Username</label>
        <input type="text" name="username" id="username">

What is the difference between ‘name’ and ‘id’ as it pertains to 1) the code and 2) the output?

And:

 <label for="meal">What do you want to eat?</label>
  <br>
  <input type="text" name="food" id="meal">

What is the relationship between ‘label for=‘meal’’ and ‘id=‘meal’’?

Thanks everyone for your help!