HELP problème affichage JavaScript

Fermé

e.khalil Messages postés 33 Date d'inscription lundi 1 juin 2009 Statut Membre Dernière intervention 15 mai 2010 - 31 mars 2010 à 01:56
e.khalil Messages postés 33 Date d'inscription lundi 1 juin 2009 Statut Membre Dernière intervention 15 mai 2010 - 2 avril 2010 à 19:15

Bonjour,
Je suis entrain de développer une application en PHP/MySQL, bref, j'ai un formulaire où je voudrais afficher/cacher un champ en fonction de la valeur sélectionnée dans <select><option></option> ... voir plus précisément en bas.
Voilà mon code:
<tr>
<td>Nom du matériel</td> <td><input type="text" name="nomMateriel" /></td>
</tr>
<tr>
<td>Type du matériel</td> <td><select name="typeMat" onchange="verifTypePeriph()">
<option value=""></option>
<option value="carteReseau">Carte Réseau</option>
<option value="carteGraphique">Carte Graphique</option>
</select></td>
<td>état</td> <td><input type="text" name="etatMateriel" /></td>
</tr>
<tr>
<td><input type="submit" name="ajoutPeripherique" value="Ajouter" /></td>
</tr>

je voudrais que lorsque je sélectionne "carte Réseau", le programme m'affiche avant le bouton submit le champ : <tr><td>Adresse IP</td> <td><input type='text' name='adrIP' /></td></tr>
, pour cela j'ai utilisé la fonction suivante, mais quand je sélectionne j'ai devant moi une page blache qui contient que Adresse IP et le champ text :(

function verifTypePeriph() {
if(document.ajouterPeripherique.typeMat.value == "carteReseau")
document.write("<tr><td>Adresse IP</td> <td><input type='text' name='adrIP' /></td></tr>");
}

SVP quelqu'un peut m'aider ??

A voir également:

HELP problème affichage JavaScript
Telecharger javascript - Télécharger - Langages
Affichage double ecran - Guide
Windows 11 affichage classique - Guide
Problème affichage fenêtre windows 10 - Guide
Comment agrandir l'affichage de l'écran - Guide

3 réponses

Réponse 1 / 3

jeangilles Messages postés 816 Date d'inscription samedi 21 juin 2008 Statut Membre Dernière intervention 17 juillet 2012 186
31 mars 2010 à 09:32

Tu pourrais passé un un span vide :
<td>Type du matériel</td> <td><select name="typeMat" onchange="verifTypePeriph()">
<option value=""></option>
<option value="carteReseau">Carte Réseau</option>
<option value="carteGraphique">Carte Graphique</option>
</select></td>
<td>état</td> <td><input type="text" name="etatMateriel" /></td>
</tr>
<tr><td><span id="ici"></span></td></tr>
<tr>
<td><input type="submit" name="ajoutPeripherique" value="Ajouter" /></td>

Et ta méthode js te donnerai :

function verifTypePeriph() {
if(document.ajouterPeripherique.typeMat.value == "carteReseau")
document.getElementById("ici").innerHTML = "Adresse IP</td> <td><input type='text' name='adrIP' />");
}

e.khalil Messages postés 33 Date d'inscription lundi 1 juin 2009 Statut Membre Dernière intervention 15 mai 2010 2
1 avril 2010 à 00:06

merci :)

e.khalil Messages postés 33 Date d'inscription lundi 1 juin 2009 Statut Membre Dernière intervention 15 mai 2010 2
1 avril 2010 à 00:07

je viens de réctifier la fonction, voilà:
function verifTypePeriph() {
if(document.ajouterPeripherique.typeMat.value == "carteReseau") {
document.getElementById("nomChamp").style.visibility = 'visible';
document.getElementById("iciChamp").style.visibility = 'visible';
document.getElementById("nomChamp").innerHTML = "Adresse IP";
document.getElementById("iciChamp").innerHTML = "<input type='text' name='adrIP' />";
} else {
document.getElementById("nomChamp").style.visibility = 'hidden';
document.getElementById("iciChamp").style.visibility = 'hidden';
}
}

Réponse 2 / 3

jeangilles Messages postés 816 Date d'inscription samedi 21 juin 2008 Statut Membre Dernière intervention 17 juillet 2012 186
1 avril 2010 à 08:51

Non, ca ne marchera pas :
Si tu sélectionnes "carteReseau", ca affichera bien ton input text, mais si tu en sélectionne ensuite un autre, l'input sera caché, mais sera toujours présent dans le formulaire, et donc validé lors du submit du formulaire (même s'il est caché)

Il faudrait modifier un peu le else :

} else {
document.getElementById("nomChamp").style.visibility = 'hidden';
document.getElementById("nomChamp").innerHTML = "";
}

Réponse 3 / 3

e.khalil Messages postés 33 Date d'inscription lundi 1 juin 2009 Statut Membre Dernière intervention 15 mai 2010 2
2 avril 2010 à 19:15

oui, vous avez raison, et c'est logique, mais au niveau de la base de données, le champ AdresseIP aura la valeur "NULL" dans les deux cas ;)
Merci @+

Discussions similaires

adele

Javascript Arrondi à 2 chiffres après la virgule

Leboncoin : j'ai un problème d'affichage

Probleme d'affichage google chrome

Obtenir un affichage décimal sur ma Casio fx 92