HTML HTML Forms Choosing Options Radio Buttons

Jason Jun
Jason Jun
9,900 Points

What is the difference between id and name attributes in form elements?

Just curious.

3 Answers

Kevin VanderWulp
Kevin VanderWulp
5,178 Points

The ID of a form input element has nothing to do with the data contained within the element. IDs are for hooking the element with JavaScript and CSS. The name attribute, however, is used in the HTTP request sent by your browser to the server as a variable name associated with the data contained in the value attribute.

For example:

<form>
    <input type="text" name="user" value="bob">
    <input type="password" name="password" value="abcd1234">
</form>

When the form is submitted, the form data will be included in the HTTP header like this:

If you add an ID attribute, it will not change anything in the HTTP header. It will just make it easier to hook it with CSS and JavaScript.

Thank you for this info. This id attribute always confuse me. It might make sense once I get to CSS

Ben Brenton
Ben Brenton
266 Points

To add to the above answer, when it comes to radio buttons in particular (if your question was relating to this lesson) the importance is that the name remains the same throughout the options so there are no multiple selections.

Jason Jun
Jason Jun
9,900 Points

Thanks for the answers. I totally get it now!