问题
I have a form with multiple fieldset
s. Each fieldset
has multiple inputs
, some of which would logically share a name
attribute.
I have looked on MDN for input name and the HTML 5 spec with no luck. Section 4.10.19.1 of the HTML 5 form spec does not mention a uniqueness requirement though.
For example:
<fieldset name="attendee">
<input name="full-name">
</fieldset>
<fieldset name="next-of-kin">
<input name="full-name">
</fieldset>
Each input
name is unique within the fieldset
, but duplicated within the form
. Is this valid?
回答1:
No, the name
attributes are not required to be unique. You could have the name attribute similar in multiple input fields (the whole principle behind radio buttons for example). Modern browsers generally see an array of information when you are submitting the form. I will give you an example in which I used PHP to parse the information, but the point stands in other programming languages.
Given your example:
<fieldset name="attendee">
<input name="full-name">
</fieldset>
<fieldset name="next-of-kin">
<input name="full-name">
</fieldset>
If you var_dump()
depending on your method POST/GET, you will see that the browser is actually remembering only the last value recorded by the full-name
attribute. Basically if your first input is John Doe
(under the attendee
fieldset) and your second input is John Green
(under the next-of-kin
fieldset), the browser will only remember John Green
regardless of your method. If you use the GET method only your URL will contain both of the full-name
attributes, but not the actual $_GET
array itself.
If you want to record both the names you can edit your code to:
<fieldset name="attendee">
<input name="full-name[]">
</fieldset>
<fieldset name="next-of-kin">
<input name="full-name[]">
</fieldset>
By using the []
the browser knows not to remember just the last value of that attribute. Now if you do a var_dump()
regardless of your method you should see:
array(1) { ["full-name"]=> array(2) {
[0]=> string(8) "John Doe"
[1]=> string(10) "John Green"
}
}
If by any chance you want to be more specific (since in one of the comments you were mentioning that you are using this in a REST API), you can edit your code like this:
<fieldset name="attendee">
<input name="full-name[attendee]">
</fieldset>
<fieldset name="next-of-kin">
<input name="full-name[next-of-kin]">
</fieldset>
Now if you submit the form, regardless of the method, you will get the following data-structure:
array(1) { ["full-name"]=> array(2) {
["attendee"]=> string(8) "John Doe"
["next-of-kin"]=> string(10) "John Green"
}
}
It is fairly simple from here to call json_encode()
on this array and get an actual JSON object(like the one bellow) that you can use with your API:
{"full-name":{"attendee":"John Doe","next-of-kin":"John Green"}}
回答2:
If you plan to manipulate these fields using ID selectors (javascript or Jquery) and you would want to keep the functionality separate then I would use unique ids. Specifying an id tag would be better if you plan to select the elements.
<fieldset id="attendeeMain" name="attendee">
<input name="full-name">
</fieldset>
<fieldset id="nextOfKin" name="next-of-kin">
input name="full-name">
</fieldset>
回答3:
I would recommend to give every field a different name,
for example if you have two fields, using the GET method, the name/value pairs in the URL will look like this:
index.html?attendee=random&full-name=random2&next-of-kin=random3&full-name=random4
for this code:
<fieldset name="attendee">
<input name="full-name">
</fieldset>
<fieldset name="next-of-kin">
<input name="full-name">
</fieldset>
So which data will be loaded in the backend, if the identifier they are called with are the same but the data different?
if you don't have a backend, and you only use the name field as a selector, I would recommend you to use the class=""
field.
来源:https://stackoverflow.com/questions/25364924/do-input-names-have-to-be-unique-in-the-same-form