Input type="radio" transformé en bouton de soumission

(reprise du message précédent)

QuentinC a écrit :
Ah, et petite question au passage, je fais comment si je veux commander deux articles ? Pourquoi ne pas mettre simplement des chekbox pour tout le monde ?

Tu ajoutes les produits les uns après les autres, tout simplement.
J'ai bien pensé à des checkbox mais cela peut provoquer des erreurs..
Le temps que tu gagnes avec des checkbox tu le perds à vérifier ton panier.

Pour le reste je suis d'accord avec toi.

Reste cette piste :

boteha-2 a écrit :
Ou pourquoi pas une simple animation CSS qui va chercher le bouton de soumission sous le tableau pour le placer sous la case radio qui est cochée.

Il est clair que cela s'adresse aux voyants mais aucun piège dans le code pour l'accessibilité.

a écrit :
Tu ajoutes les produits les uns après les autres, tout simplement.

OK. Du coup tes boutons radio ne font vraiment plus aucun sens. Ca doit définitivement être des boutons normaux. Inutile de se torturer le cerveau plus longtemps !

Ne pas oublier que le principe de base des boutons radio, c'est faire un choix unique et exclusif parmi un ensemble exhaustif de possibilités. Il n'y a qu'un seul élément sélectionné à la fois, ou autrement dit quand on change son choix, le précédent est effacé. Ce n'est pas vraiment ce qui se passe ici.

Quant à ton animation, je vois quand même un potentiel piège: un malvoyant utilisant un fort grossissement pourrait passer complètement à côté, et chercher le bouton de soumission là où il n'est plus. Ca ne me parait pas une bonne idée que de vouloir le déplacer d'une grande distance.

Tu vas aussi probablement avoir un problème de cohérence au niveau de l'ordre du focus, pour les utilisateurs voyants qui naviguent au clavier. Ils vont bien voir le bouton se déplacer mais il va rester dans son ordre de tabulation original, d'après l'ordre logique visuel il sera sauté et va donc paraitre impossible à atteindre ! Les seuls moyens de contrer ça est de déplacer effectivement le bouton au bon endroit dans le DOM et pas uniquement en CSS/JavaScript, mais là c'est moi avec mon lecteur d'écran qui risque de ne pas retrouver ce bouton baladeur. Ou sinon tu peux jouer avec tabindex, mais c'est ignoble et là tu vas au devant de bien plus gros problèmes encore.
Modifié par QuentinC (04 May 2025 - 19:23)