momentálně nepřijímám zakázky
TIL: HTML5 atribut FORM, aneb svazování formulářových prvků s formulářem

Today I Learned. Dvacet let kóduji weby, ale tohle jsem dnes použil poprvé. Pamatuji si, že v HTML nebylo podle specifikace možné použít <submit>
mimo <form>
tag. Samozřejmě to šlo svázat Javascriptem, ale čistě v HTML to udělat nešlo, nefungovalo by to, data by se neodeslala. Dnes už to v HTML5 možné je, konkrétně díky atributu form
, kterým se propojí formulář a formulářový prvek.
Submit mimo formulář
<form id="formular" method="get" action="...">
<input type="text" name="name">
</form>
<input type="submit" form="formular">
Zajímavé je, že tímto atributem je možné svázat nejen submit, ale i další formulářová pole.
<form id="formular" method="get" action="...">
<label>
Jméno a příjmení:
<input type="text" name="...">
</label>
<input type="submit" value="Odeslat">
</form>
<textarea cols="..." rows="..." form="formular"></textarea>
Mohou se vnořovat formuláře do sebe?
Ne („Flow content, but with no form element descendants.“), ale lze to snadno obejít…
<form id="formular1" method="get" action="..."></form>
<form id="formular2" method="get" action="..."></form>
<input type="text" name="input1" form="formular1">
<input type="text" name="input2" form="formular2">
<input type="submit" value="Odeslat" form="formular1">
<input type="submit" value="Odeslat" form="formular2">
Taková hloupost, až mi celé ty roky unikala. 🤦🏼♂️
Další zdroje:
Publikováno: 26.11.2020