value - Difference between id and name attributes in HTML
which statement about the name and id attributes of form fields is false? (13)
What is the difference between the
name attributes? They both seem to serve the same purpose of providing an identifier.
I would like to know (specifically with regards to HTML forms) whether or not using both is necessary or encouraged for any reasons.
Here is a brief summary:
idis expected to be unique within the page.
namecorresponds to the form element and identifies what is posted back to the server.
name Vs id
- Name of the element. For example used by the server to identify the fields in form submits.
- Supporting elements are
<button>, <form>, <fieldset>, <iframe>, <input>, <keygen>, <object>, <output>, <select>, <textarea>, <map>, <meta>, <param>
- Name does not have to be unique.
- Often used with CSS to style a specific element. The value of this attribute must be unique.
- Id is Global attributes, they can be used on all elements, though the attributes may have no effect on some elements.
- Must be unique in the whole document.
- This attribute's value must not contain white spaces, in contrast to the class attribute, which allows space-separated values.
- Using characters except ASCII letters and digits, '_', '-' and '.' may cause compatibility problems, as they weren't allowed in HTML 4. Though this restriction has been lifted in HTML 5, an ID should start with a letter for compatibility.
Based on personal experiences and according to the W3 Schools description for attributes:
name is an attribute that is useful to specific elements (such as form elements, etc) in HTML. Its value is mostly sent to the backend for processing.
Below is an interesting use of the id attribute. It is used within the tag and used to identify the form for elements outside of the boundaries so that they will be included with the other fields within the form.
<form action="action_page.php" id="form1"> First name: <input type="text" name="fname"><br> <input type="submit" value="Submit"> </form> <p>The "Last name" field below is outside the form element, but still part of the form.</p> Last name: <input type="text" name="lname" form="form1">
ID i used to uniquely identify an element.
Name is used in forms. when even u submit a form. and if you dont give any name, nothing will will be submitted. And the ones only with name attribute will go out.
This bit does still currently work in Firefox although I suppose in the future it might not get allowed through.
You can have multiple input fields with the same name value, as long as you aren't planning to submit the old fashioned way.
What’s the difference? The short answer is, use both and don’t worry about it. But if you want to understand this goofiness, here’s the skinny:
id= is for use as a target like this:
<some-element id="XXX"></some-element>for links like this:
name= is also used to label the fields in the message send to a server with an HTTP (HyperText Transfer Protocol) GET or POST when you hit submit in a form.
Sometimes the the name= and id= names will differ, because the server is expecting the same name from various forms in the same document or various radio buttons in the same form as in the example above. The id= must be unique; the name= must not be.
NOTE: attribute "name" for some tags like
<a> is not supported in HTML5.
name attribute is used when sending data in a form submission. Different controls respond differently. For example, you may have several radio buttons with different
id attributes, but the same
name. When submitted, there is just the one value in the response - the radio button you selected.
Of course, there's more to it than that, but it will definitely get you thinking in the right direction.
The way I think about it and use it is simple:
name is used for form handling in PHP when a form is submitted via HTML (has to be unique in a form - to some extent, see Paul's comment below)
This link has answers to the same basic question, but basically, id is used for scripting identification and name is for server-side.
<form action="demo_form.asp"> <label for="male">Male</label> <input type="radio" name="sex" id="male" value="male"><br> <label for="female">Female</label> <input type="radio" name="sex" id="female" value="female"><br> <input type="submit" value="Submit"> </form>