Léon Woronꜩoff

Notes ponctuelles

Autre option

Dernière miſe à jour

N'avez-vous jamais vu une ſélection dans un formulaire qui manque d'options et vous fruſtre de ne pouvoir ajouter l'option qui manque ſelon vous? Et bien, pour peu que l'on ſ'en donne la peine, il eſt tout à fait poſſible de donner la poſſibilité à l'utiliſateur d'ajouter une option. Je l'ai fait dans un exemple en alliant le Langage à Éléments Hypertexte Étendu 1.0 (page en anglais), (Page de l'Inter-Réſeau) Perſonnelle: Pré-Proceſſeur hypertexte (traduction libre) et en langage de programmation de l'aſſociation européenne pour la ſtandardiſation des ſyſtèmes d'information et de communication (page en anglais) non-intruſif. Voici tout d'abord le code en Langage à Éléments Hypertexte Étendu / (Page de l'Inter-Réſeau) Perſonnelle: Pré-Proceſſeur hypertexte (le fichier eſt nommé form.php):

<?php if(isset($_POST["selection"]) && $_POST["selection"]=="other") { $_POST["selection"]=$_POST["othertext"]; } echo'<?xml version="1.0" encoding="UTF-8" ?>'."\n"; ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <script type="text/javascript" src="form.js"></script> <title>Form teſt</title> </head> <body> <h1>Form teſt</h1> <?php if (isset($_POST["selection"])) { echo" <p>You choſed: ".$_POST["selection"]."</p>\n"; } ?> <form method="post" action="form.php" enctype="multipart/form-data" accept="text/plain" id="theform"> <fieldset> <legend>The teſt</legend> <p> <label for="selection">Choſe</label>: <select id="selection" name="selection"> <optgroup label="Choices"> <option value="option1">Option 1</option> <option value="option2">Option 2</option> <option value="other">Other (write it)</option> </optgroup> </select> <span id="ifother"> <label for="othertext">Other</label>: <input type="text" name="othertext" id="othertext" /> </span> <input type="submit" value="Teſt" /> </p> </fieldset> </form> </body> </html>

Bon, la baliſe span, c'eſt loin d'être bien, mais c'eſt plus ſimple que de chercher après la bonne baliſe label en langage de programmation de l'aſſociation européenne pour la ſtandardiſation des ſyſtèmes d'information et de communication.

Maintenant, le langage de programmation de l'aſſociation européenne pour la ſtandardiſation des ſyſtèmes d'information et de communication (le fichier eſt nommé form.js):

function hideshowother() { if(document.getElementById("selection").value=="other") { document.getElementById("ifother").style.display="inline"; } else { document.getElementById("ifother").style.display="none"; } } function testselection() { document.getElementById("ifother").style.display="none"; document.getElementById("selection").onchange=hideshowother; } window.onload=testselection;

J'ai utiliſé onchange parce qu'il ſemblait ſuffiſant dans les navigateurs où j'ai eſſayé cela, mais il eſt peut-être des navigateurs où il faut ajouter le même code avec onclic ou onfocus (quant à onmouseover, il entraîne un comportement bizarre, tout du moins avec un des navigateurs eſſayé). Je n'ai rien commenté (je le ferais peut-être un jour), pour réſumer, en Langage à Éléments Hypertexte Étendu, le formulaire contient une ſélection avec les options et, en dernier, une option identifiée comme "autre" ainſi qu'un champ texte où l'on peut écrire l'autre option, le langage de programmation côté ſerveur ne fait que mettre en lien l'option "autre" et le champ texte et enfin, langage de programmation côté client cache le champ texte et ſi l'on change d'option dans la ſélection, il vérifie ſi l'on choiſit "autre" et ſi c'eſt le cas, il affiche le champ texte, ſinon, il le cache.

Vous pouvez eſſayer form.php en conjonction avec form.js.

Signaler une erreur

Pour me ſignaler les fautes (orthographe, grammaire, conjugaiſon, typographie, …) que je peux faire, veuillez me contacter plutôt que de faire un commentaire. Je vous en remercie d'avance.

Commentaire(s)

Il n'y a actuellement aucun commentaire.

Commenter

À lire au minimum avant d'envoyer un commentaire pour le faire en connaiſſance de cauſe: ce qui ſert de règlement d'ordre intérieur.

Envoyer un commentaire

Rétro-lien

Adreſſe de rétro-lien de ce billet (notez que certain moteur de journal extime informe d'une erreur comme par exemple le fait que cette adreſſe n'eſt nullement une adreſſe de rétro-lien, mais c'en eſt bien une et le rétro-lien ſe fait de toute façon).