Modulo HTML con più elementi di controllo nascosti con lo stesso nome
https://stackoverflow.com/questions/452066
-
19-08-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianDomanda
È legale avere un modulo HTML con più di un "nascosto" elemento di controllo con lo stesso nome? Mi aspetto di ottenere i valori di tutti questi elementi sul server. Se è legale, i principali browser implementano correttamente il comportamento?
Soluzione
I browser sono OK con esso. Tuttavia, il modo in cui la libreria dell'applicazione analizza può variare.
I programmi sono supposti per raggruppare elementi identici. Sebbene la specifica HTML non lo dica esplicitamente, è implicitamente dichiarata nel documentazione sulle caselle di controllo :
Diverse caselle di controllo in un modulo possono condividere lo stesso nome di controllo. Quindi, per ad esempio, le caselle di controllo consentono agli utenti di selezionare più valori per lo stesso Proprietà.
Altri suggerimenti
Diverse tecnologie sul lato server possono variare. Con PHP, è possibile utilizzare una sintassi in stile array per il nome per forzare la creazione di una raccolta sul lato server. Se pubblicato sul server, $ _POST ['colors'] sarà un array con due valori, # 003366 e # 00FFFF :
<input type="hidden" name="colors[]" value="#003366" />
<input type="hidden" name="colors[]" value="#00FFFF" />
In generale, ti consigliamo di utilizzare un nome standard senza parentesi quadre. La maggior parte delle tecnologie lato server sarà in grado di analizzare i dati risultanti e fornire una raccolta di qualche tipo. Node.js offre utili funzionalità tramite querystring.parse :
const querystring = require('querystring')
querystring.parse('foo=bar&abc=xyz&abc=123') // { foo: 'bar', abc: ['xyz', '123'] }
Se hai qualcosa del genere:
<input type="hidden" name="x" value="1" />
<input type="hidden" name="x" value="2" />
<input type="hidden" name="x" value="3" />
La tua stringa di query apparirà come x = 1 & amp; x = 2 & amp; x = 3 ... A seconda del software server che stai utilizzando per analizzare la stringa di query, ciò potrebbe non funziona bene.
Sì, e la maggior parte dei server delle applicazioni raccoglierà gli elementi corrispondenti e li concatenerà con virgole, in modo tale che un modulo come questo:
<html>
<form method="get" action="http://myhost.com/myscript/test.asp">
<input type="hidden" name="myHidden" value="1">
<input type="hidden" name="myHidden" value="2">
<input type="hidden" name="myHidden" value="3">
<input type="submit" value="Submit">
</form>
</html>
... si risolverebbe in un URL (nel caso GET - POST funzionerebbe allo stesso modo, però) in questo modo:
http://myhost.com/myscript.asp?myHidden=1& ; myHidden = 2 & amp; myHidden = 3
... e ti verrebbero esposti in codice come questo: (ad esempio, seguendo qualcosa come Response.Write (Request.QueryString (" myHidden ")):
1, 2, 3
Quindi, per afferrare i valori, devi solo dividere la stringa e accedervi come un array (o qualsiasi cosa sia comparabile nella tua lingua preferita).
(Dovrebbe essere chiarito: in PHP, è leggermente diverso (come sottolinea Johnathan, la notazione tra parentesi espone gli elementi come un array al tuo codice PHP), ma ASP, ASP.NET e ColdFusion espongono tutti i valori come una virgola -separated list. Quindi sì, il nome duplicato è completamente valido.)
HTML5
La sezione non normativa 4.10.1.3 La configurazione di un modulo per comunicare con un server afferma esplicitamente che è valida:
Più controlli possono avere lo stesso nome; ad esempio, qui diamo a tutte le caselle lo stesso nome e il server distingue quale casella è stata selezionata vedendo quali valori vengono inviati con quel nome & # 8212; come i pulsanti di opzione, ricevono anche valori univoci con l'attributo value.
La versione normativa di questo è semplicemente che non è vietata da nessuna parte, e l'algoritmo di invio del modulo dice esattamente quale richiesta deve essere generata:
- non viene violato alcun vincolo: https://www.w3.org/TR /html5/forms.html#constraints
- più nomi vengono aggiunti al set di dati "quot form" " uno dopo l'altro: https: //www.w3. org / TR / HTML5 / Forms.html # costruendo-form-data-set
- codifiche come
application / x-www-form-urlencodedpassano sopra il set di dati "quot form" " e sputare piùkey = valhttps://www.w3.org/TR/html5/forms.html#url-encoded-form-data
In particolare per PHP ho fatto alcuni test con nomi di array in input nascosti e condivido qui i miei risultati:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Post Hidden 2D Arrays</title>
</head>
<body>
<form name="formtest" method="POST" target="_self">
<input type="hidden" name="elem['name'][]" value="first">
<input type="hidden" name="elem['name'][]" value="second">
<input type="hidden" name="elem['name'][]" value="third">
<input type="hidden" name="elem['name'][]" value="fourth">
<input type="hidden" name="elem['type'][]" value="normal">
<input type="hidden" name="elem['type'][]" value="classic">
<input type="hidden" name="elem['type'][]" value="regular">
<input type="hidden" name="elem['type'][]" value="basic">
<input type="hidden" name="elem['size'][]" value="4">
<input type="hidden" name="elem['size'][]" value="7">
<input type="hidden" name="elem['size'][]" value="3">
<input type="hidden" name="elem['size'][]" value="6">
<input type="hidden" name="elem['form'][]" value="triangle">
<input type="hidden" name="elem['form'][]" value="square">
<input type="hidden" name="elem['form'][]" value="hexagon">
<input type="hidden" name="elem['form'][]" value="circle">
<input type="submit" name="sendtest" value="Test">
</form>
<xmp>
<?php
print_r( In particolare per PHP ho fatto alcuni test con nomi di array in input nascosti e condivido qui i miei risultati:
Array
(
[elem] => Array
(
['name'] => Array
(
[0] => first
[1] => second
[2] => third
[3] => fourth
)
['type'] => Array
(
[0] => normal
[1] => classic
[2] => regular
[3] => basic
)
['size'] => Array
(
[0] => 4
[1] => 7
[2] => 3
[3] => 6
)
['temp'] => Array
(
[0] => triangle
[1] => square
[2] => hexagon
[3] => circle
)
)
[sendtest] => Test
)
L'invio del modulo genera il risultato successivo:
<input type="hidden" name="elem[0]['name']" value="first">
<input type="hidden" name="elem[1]['name']" value="second">
<input type="hidden" name="elem[2]['name']" value="third">
<input type="hidden" name="elem[3]['name']" value="fourth">
<input type="hidden" name="elem[0]['type']" value="normal">
<input type="hidden" name="elem[1]['type']" value="classic">
<input type="hidden" name="elem[2]['type']" value="regular">
<input type="hidden" name="elem[3]['type']" value="basic">
<input type="hidden" name="elem[0]['size']" value="4">
<input type="hidden" name="elem[1]['size']" value="7">
<input type="hidden" name="elem[2]['size']" value="3">
<input type="hidden" name="elem[3]['size']" value="6">
<input type="hidden" name="elem[0]['temp']" value="triangle">
<input type="hidden" name="elem[1]['temp']" value="square">
<input type="hidden" name="elem[2]['temp']" value="hexagon">
<input type="hidden" name="elem[3]['temp']" value="circle">
Dopo aver visto questo risultato ho fatto più test cercando una migliore disposizione dei valori dell'array e sono finito con questo (mostrerò solo i nuovi input nascosti):
Array
(
[elem] => Array
(
[0] => Array
(
['name'] => first
['type'] => normal
['size'] => 4
['temp'] => triangle
)
[1] => Array
(
['name'] => second
['type'] => classic
['size'] => 7
['temp'] => square
)
[2] => Array
(
['name'] => third
['type'] => regular
['size'] => 3
['temp'] => hexagon
)
[3] => Array
(
['name'] => fourth
['type'] => basic
['size'] => 6
['temp'] => circle
)
)
[sendtest] => Test
)
Ottenere questo risultato dopo aver inviato il modulo:
<*>
Spero che questo aiuti alcuni.
POST);
?>
</xmp>
</body>
</html>
L'invio del modulo genera il risultato successivo:
<*>Dopo aver visto questo risultato ho fatto più test cercando una migliore disposizione dei valori dell'array e sono finito con questo (mostrerò solo i nuovi input nascosti):
<*>Ottenere questo risultato dopo aver inviato il modulo:
<*>Spero che questo aiuti alcuni.
Credo che sia legale, almeno nei casi di pulsanti di opzione e caselle di controllo. Quando devo aggiungere dinamicamente input di textbox in XSLT, do loro lo stesso nome; in ASP.NET, Request.Form [" whatever_name "] è una stringa di tutti questi valori separati da virgola.
Ho appena provato a usare lo stesso nome di controllo, contee [] per diversi ingressi SELECT in modo che le contee in Inghilterra, Scozia, Galles e Irlanda in ognuna vengano passate come valori per lo stesso parametro. PHP lo gestisce bene, ma il validatore HTML dà un avvertimento. Non so se tutti i browser lo gestiranno allo stesso modo.
