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 trialPaul Kelly
3,541 PointsI still don't understand why you need to both attributes 'id' and 'value', and why they are/have to be the same.
<input type="radio" id="under_13" value="under_13" name="user_age">
The teacher slightly glossed over this bit, saying:
"So all of the other attributes are pretty much self explanatory. We've used the id attribute and the value attribute previously."
Can someone please explain to me these attributes and the difference between them more clearly, specifically in relation to this exercise.
Thank you Paul
4 Answers
Antti Lylander
9,686 PointsAt this point, I suggest to concentrate on learning how something works and not bothering yourself too much with trying to understand why it is the way it is. I don't have an easy answer to your question but i have a couple guesses:
- some historical reason
- value gets sent to server and it's nice that you can name it anything that fits your programming and it's never shown to user. Maybe you'll sometimes even create the value dynamically. I don't know, but there must be some use case where it is necessary to have both.
Christopher Phillips
10,061 Pointsid's are associated with css as well as html element relations.
value is what gets sent to the server for a stored answered.
It's purposeful (helps with code readability) that in some of these examples, they are the same but they accomplish separate tasks.
Antti Lylander
9,686 PointsIt's all explained here very clearly: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/radio
Paul Kelly
3,541 PointsThank you, I can see this site will be my friend in the coming months.
OK so let's see if I have got it:
'name' refers to the group that the buttons are all in (ie. the question being asked "are you over 13?")
'value' is the record of the answer the user chose
And I thiink..
'id' is there so that it can be linked to the label element.
But this is the bit that's confusing me, why do you need both? In the example in the lesson the 'answer' (sorry I don't know the term, I'd never done any coding before a month ago) to both 'value' and 'id' are identical, and in the example on the mdn link they are 'email' and 'contactChoice1' respectively. Can't you just have one question and one answer?
There is clearly something fundamental that I'm not getting, like I said I'm new to this, please can someone help me to understand?
SURENDRA MALLA
3,727 Pointswhile skipping to understand why "id" "name" and the rest of attribute is used,. even more confusing, the code below just works with the same results without the use of any attributes
<label>age:</label>
<input type="radio">
<label class="light">under 13</label><br>
<input type="radio">
<label class="light">over 13</label>
Paul Kelly
3,541 PointsPaul Kelly
3,541 PointsThank you Antti, I do sometimes have a habit of needing to understanding every reason behind every minute detail, it's just the way I learn I guess. I do understand that you have to walk before you can run though.
Thanks for the help
Paul
Antti Lylander
9,686 PointsAntti Lylander
9,686 PointsYes, I understand. I also like to understand rather than just take everything given, but I've also learned that sometimes it's not the best way. Often, when you just keep going, the pieces will fall into places and one day you just notice that everything is clear. In programming, there will always be something that you don't know and you'll have to live with it.