Formularis: id vs name, i DOM
Alejandro Exojo
Estic fent un formulari, el típic que demana dades personals de l'usuari, es
valida amb JavaScript, i es enviat al servidor. És un problema acadèmic (vull
dir que és una pràctica de la universitat, i que ja sé quin serà el navegador
per fer la comprovació), però vull explorar totes les possibilitats del "món
real", i saber si hi trobeu avantatges i inconvenients.
Vaig partir del primer exemple de l'especificació:
http://www.w3.org/TR/html401/interact/forms.html#h-17.1
Allà es fa servir l'atribut id per diferenciar els diferents camps, i
associar-los al label corresponent. Després d'això, he fet la validació al
costat del client amb JavaScript, i fent servir document.getElementById() per
accedir a cada element del formulari, i comprovar els valors. Fins aquí cap
problema.
Però en enviar-ho al servidor, veig que no arriba cap informació. Comprovo que
jo estava equivocat en una cosa: l'atribut name no està desaprovat a tot
arreu, només ho està si es fa servir com a "àncora" (per indicar el fragment
del document, com a "doc.html#secció"), però no pels camps del formulari. De
fet, pel que he trobat, sembla que els name als camps del formulari són
completament imprescindibles:
http://www.quirksmode.org/oddsandends/forms.html
http://www.forosdelweb.com/f4/javascript-php-xhtml-id-name-394552/
Vist això, veig dues possibilitats:
1. Afegeixo els name, i els dono el mateix valor que els id. Amb això hem
funciona tot, i no hauria de ser major problema. L'únic inconvenient que hi
veig, és que el marcat és redundant.
2. Canvio id per name. Això té l'inconvenient de que els label deixen de
funcionar (com es comenta a l'enllaç a quirksmode.org). També implica que no
es pot fer servir document.getElementById(), el que no sé si és bo o dolent
(i aquí és a on més dubtes tinc, i més us agrairé la vostra opinió). Es pot
accedir als elements del formulari igualment, per exemple amb
document.forms[0].elements, i altres variants. No sé què en penseu d'aquests
mètodes i propietats, però no sé perquè, a mi em sonen més aviat a obsolets,
o menys estàndards. No sé si estan millor o pitjor suportats pels navegadors.
Això és tot i perdó si m'he estès massa. O:-)
Gracies.
--
Alex (a.k.a. suy) - GPG ID 0x0B8B0BC2
http://barnacity.net/ - Jabber ID: s...@bulmalug.net
Oscar Sanchez Casamitjana
jo no veig tanta redundància com dius, ja que una informació la
necessita només el servidor, mentre que l'altra la fa servir l'agent
usuari per associar els controls (més info al meu següent comentari).
> 2. Canvio id per name. Això té l'inconvenient de que els label
> deixen de
> funcionar (com es comenta a l'enllaç a quirksmode.org). També
> implica que no
> es pot fer servir document.getElementById(), el que no sé si és bo o
> dolent
> (i aquí és a on més dubtes tinc, i més us agrairé la vostra opinió).
és dolent per la accessibilitat. associar explícitament un control i
la seva etiqueta es un del requeriments de prioritat 2 de les WCAG [1]
> Es pot accedir als elements del formulari igualment, per exemple amb
> document.forms[0].elements, i altres variants. No sé què en penseu
> d'aquests
> mètodes i propietats, però no sé perquè, a mi em sonen més aviat a
> obsolets,
> o menys estàndards. No sé si estan millor o pitjor suportats pels
> navegadors.
per temes concrets de JavaScript es millor que preguntis a la llistat
JavaEScript [2], on hi ha gent que et podrà contestar amb millor
coneixement de causa (apart d'estar on-topic).
oscar.
++
[1] http://www.w3.org/TR/WAI-WEBCONTENT/wai-pageauth.html#tech-associate-labels
[2] http://javaescript.scriptia.net/
Alejandro Exojo
> jo no veig tanta redundància com dius, ja que una informació la
> necessita només el servidor, mentre que l'altra la fa servir l'agent
> usuari per associar els controls (més info al meu següent comentari).
Bé, trobo que és redundant que hagis d'afegir dos atributs, quan en el fons
tots dos faran el mateix: donar un nom a cada input. Cert que amb dos podràs
triar dues fórmules de nombrat diferents, però no m'imagino el cas en que
això sigui necessari, i no pugis fer servir el mateix nom al GET/POST per
associar-ho al label.
> és dolent per la accessibilitat. associar explícitament un control i
> la seva etiqueta es un del requeriments de prioritat 2 de les WCAG [1]
OK. Soc bastant partidari de l'accessibilitat, o sigui que he optat per fer
servir id i name alhora.
> per temes concrets de JavaScript es millor que preguntis a la llistat
> JavaEScript [2], on hi ha gent que et podrà contestar amb millor
> coneixement de causa (apart d'estar on-topic).
Sí, és bona idea. Vaig pensar en si aquesta llista era la més adient, i em va
semblar recordar que es va dir que tot i el nom, la temàtica era una mica
oberta, i com tampoc hi ha massa tràfic... :)
Moltes gràcies pels consells.
Choan Gálvez
On 07/12/2007, at 18:35, Alejandro Exojo wrote:
>
> El Jueves, 6 de Diciembre de 2007, Oscar Sanchez Casamitjana escribió:
>> jo no veig tanta redundància com dius, ja que una informació la
>> necessita només el servidor, mentre que l'altra la fa servir l'agent
>> usuari per associar els controls (més info al meu següent comentari).
>
> Bé, trobo que és redundant que hagis d'afegir dos atributs, quan en
> el fons
> tots dos faran el mateix: donar un nom a cada input. Cert que amb
> dos podràs
> triar dues fórmules de nombrat diferents, però no m'imagino el cas
> en que
> això sigui necessari, i no pugis fer servir el mateix nom al GET/
> POST per
> associar-ho al label.
Va, doncs, un cas:
<fieldset>
<legend>Sexe</legend>
<ul>
<li><label for="m"><input type="radio" name="sexe" id="m" />
Mascle</label></li>
<li><label for="f"><input type="radio" name="sexe" id="f" /
>Femella</label></li>
</ul>
</fieldset>
Salut.
--
Choan Gálvez
<choan....@gmail.com>
<http://choangalvez.nom.es/>
Alejandro Exojo
He fet una prova amb això, i llavors sempre s'envia "sexe=on" per GET/POST.
Segurament estic deixant de veure alguna cosa, però no veig la utilitat si no
transmets al servidor quelcom diferent en un cas o altre.
Alejandro Exojo
Perdó, ja he vist que hem deixava: si afegeixes value="m" i value="f" llavors
sí que passes informació útil pel POST. :)
Suposo que ja es nota, però porto molt poc temps fent formularis. O:-)
Choan Gálvez
No, soc jo el que he oblidat donar valors als inputs.
<fieldset>
<legend>Sexe</legend>
<ul>
<li><label for="m"><input type="radio" name="sexe" id="m" value="0"/>
Mascle</label></li>
<li><label for="f"><input type="radio" name="sexe" id="f" value="1"/
> Femella</label></li>
</ul>
</fieldset>
Salut.
--
Choan