lonne-lee / educom-webshop-basis

0 stars 0 forks source link

Zorg dat elk input/select/textarea een unieke `id` heeft #20

Closed JeroenHeemskerk closed 1 month ago

JeroenHeemskerk commented 1 month ago

In de code hieronder wordt id email gebruikt om de label en de input aan elkaar te koppelen https://github.com/lonne-lee/educom-webshop-basis/blob/74924eb41fefb84002eb6244f902240cdb5f4f38/contact.html#L38-L39

Maar later in de code is er nog een label voor email https://github.com/lonne-lee/educom-webshop-basis/blob/74924eb41fefb84002eb6244f902240cdb5f4f38/contact.html#L60

Deze laatste zou je niet verwachten dat deze het input veld bovenin het formulier selecteert.


Daarnaast wordt id commvoorkeur 3x herhaald in onderstaande code.

Bij een input of type radio moet de name hetzelfde zijn, maar de id moet juist verschillend zijn.

https://github.com/lonne-lee/educom-webshop-basis/blob/74924eb41fefb84002eb6244f902240cdb5f4f38/contact.html#L58-L64 en geen van de 'for' attributen in de bijbehorende labels matchen de id's van de radio buttons waar ze bij horen.

Ik zou er iets van maken als:

<p><b>Geef een communicatievoorkeur aan:</b></p> 
 <input type="radio" id="commPreference-email" .. > 
 <label for="commPreference-email">E-mail</label><br> 
 <input type="radio" id="commPreference-phone" .. > 
 <label for="commPreference-phone">Telefoon</label><br> 
 <input type="radio" id="commPreference-postal" .. > 
 <label for="commPreference-postal">Post</label> 
lonne-lee commented 1 month ago

Opgelost in #19, bedankt!