Probleme pour masquer mon champs texte [Résolu]

Question

Probleme pour masquer mon champs texte [Résolu]

Signaler

msi79 - 8 déc. 2014 à 00:19
@karamel

Messages postés: 1787
Date d'inscription: vendredi 9 mai 2008
Statut: Non membre
Dernière intervention: 9 juin 2021

- 8 déc. 2014 à 20:46

Bonjour,
j'ai eu un code sur le net qui me permet de cacher ou faire apparaitre un champs texte mais il se trouve que le code se comporte pas comme je veux.
je voudrais que le champ reste caché et que c'est quand je coche le bouton qu'il apparait . le code que j'ai fait le contraire .

voici mon code :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans titre</title>
<script language="Javascript">
// ==================
//	Activations - Désactivations
// ==================
function GereControle(Controleur, Controle, Masquer) {
var objControleur = document.getElementById(Controleur);
var objControle = document.getElementById(Controle);
	if (Masquer=='1')
		objControle.style.visibility=(objControleur.checked==true)?'visible':'hidden';
	else
		objControle.disabled=(objControleur.checked==true)?false:true;
	return true;
}
</script>
</head>

<body>

<table width="568" border="0">
        <tr>
          <td width="65">Assure</td>
          <td width="70"><input type="radio" id="radio_10" name="radios_0" onClick="GereControle('radio_10', 'liste_10', '1');" CHECKED> <label for="radio_10">Oui</label></td>
          <td width="419"><input type="radio" id="radio_20" name="radios_0" onClick="GereControle('radio_10', 'liste_10', '1');"> <label for="radio_20">Non</label></td>
        </tr>
      </table>
<div id="liste_10">


<div style="position: absolute; top: 100px; left: 14px; height: 347px;">
  <table width="1003" height="203" border="0" align="center" bgcolor="#FFFFFF">
    <tr>
      <td colspan="4"></td>
    </tr>
    <tr>
      <td width="210"><span class="Style13">Nom assurance</span></td>
      <td colspan="3"><input name="nom_assurance" type="text"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/></td>
    </tr>
    <tr>
      <td><span class="Style13">Nom Société</span></td>
      <td colspan="3"><input name="nom_societe" type="text" size="50"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/></td>
    </tr>
    <tr>
      <td><span class="Style13">Nom de l'assuré</span></td>
      <td colspan="3"><input name="nom_assure" type="text"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/></td>
    </tr>
    <tr>
      <td><span class="Style13">Numéro de carte d'assurance:</span></td>
      <td colspan="3"><input name="num_carte" type="text"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/></td>
    </tr>
    <tr>
      <td><span class="Style13">Plafond</span></td>
      <td width="168"><span class="Style7">
        <input name="plafond" type="text"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/>
      </span></td>
      <td width="89"> </td>
      <td width="382"> </td>
    </tr>
    <tr>
      <td>Taux de couverture:</td>
      <td colspan="3"><span class="Style7">
        <select name="taux"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'>
          <option>0</option>
          <option>1</option>
          <option>2</option>

        </select>
      %</span></td>
    </tr>
    <tr>
      <td><span class="Style13">Tiers payant: </span></td>
      <td colspan="2"><input name="tiers" type="text"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/></td>
      <td> </td>
    </tr>
    </table>
</div></div>
</body>
</html>

A voir également:

6 réponses

Répondre Posez votre question

jordane45 · Answer 1 · 2014-12-08T00:57:34+0100

Réponse 1 / 6

jordane45

Messages postés: 32948
Date d'inscription: mercredi 22 octobre 2003
Statut: Modérateur
Dernière intervention: 13 juin 2021

351
8 déc. 2014 à 00:57

Encore une fois. ..ton souci porte sur du javascript et non du php.......
je déplace au bon endroit.

@karamel · Answer 2 · 2014-12-08T10:47:46+0100

bonjour

niveau codage c'st pas beau sinon tu doit testé l'id du radio d'ou le probleme et aussi au niveau du html des input a l'appel de la fonction en parametre tu met a chaque fois le meme id

function GereControle(Controleur, Controle) {

document.getElementById(Controle).style.visibility=(Controleur=='radio_10')?'visible':'hidden';

}

<table width="568" border="0">
        <tr>
          <td width="65">Assure</td>
          <td width="70"><input type="radio" id="radio_10" name="radios_0" onClick="GereControle('radio_10', 'liste_10');" CHECKED> <label for="radio_10">Oui</label></td>
          <td width="419"><input type="radio" id="radio_20" name="radios_0" onClick="GereControle('radio_20', 'liste_10');"> <label for="radio_20">Non</label></td>
        </tr>
      </table>

rien ne sert de courir il faut partir a point.
cours Forest cours !

msi79 · Answer 3 · 2014-12-08T17:20:29+0100

je ne comprend pas bien la reponse de @æKasma .
j'ai trouve un code qui parait plus simple mais c'est la même chose . voici mon code :


<table width="568" border="0">
        <tr>
          <td width="80">Assure ?</td>
          <td width="58"><label><input type="radio" name="choix" value="1" /></label></td>
          <td width="58">Oui</td>
          <td width="54"><label><input type="radio" name="choix" value="0" /></label></td>
          <td width="296">Non</td>
        </tr>
    </table>


</div>
<div id="hidden">
<form id="form1" name="form1" method="post" action="">
<table width="497" height="203" border="0" align="left" bgcolor="#FFFFFF">
    <tr>
      <td colspan="2"></td>
    </tr>
    <tr>
      <td width="110"><span class="Style13">Nom assurance</span></td>
      <td><input name="nom_assurance" type="text"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/></td>
    </tr>
    <tr>
      <td><span class="Style13">Nom Société</span></td>
      <td><input name="nom_societe" type="text" size="50"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; width:150px'/></td>
    </tr>
    <tr>
      <td><span class="Style13">Nom de l'assuré</span></td>
      <td><input name="nom_assure" type="text"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/></td>
    </tr>
    <tr>
      <td><span class="Style13">Numéro de carte d'assurance:</span></td>
      <td><input name="num_carte" type="text"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/></td>
    </tr>
    <tr>
      <td><span class="Style13">Plafond</span></td>
      <td width="194"><span class="Style7">
        <input name="plafond" type="text"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/>
      </span></td>
      </tr>
    <tr>
      <td>Taux de couverture:</td>
      <td>
        <select name="taux"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; width:100px'>
          <option>0</option>
          <option>1</option>
          <option>2</option>
        </select>
      %</td>
    </tr>
    <tr>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td colspan="2"><span class="Style13"> </span>
        <table width="391" border="0">
          <tr>
            <td>Tiers payant:</td>
            <td><input type="radio" name="tiers" value="1" id="ok_0" /></td>
            <td>Part assurance</td>
            </tr>
          <tr>
            <td> </td>
            <td><input type="radio" name="tiers" value="0" id="ok_1" /></td>
            <td>Part Patient</td>
          </tr>
          </table></td>
      </tr>
    </table>
</div>
</form> 


<script type="text/javascript">
var oui = document.form1.choix[0];
var non = document.form1.choix[1];
oui.onclick = function() {
document.getElementById("hidden").style.display = "block"
};
non.onclick = function() {
document.getElementById("hidden").style.display = "none"
};
</script>

@karamel · Answer 4 · 2014-12-08T17:38:15+0100

tu doit remplacer la fonction par celle que j'ai mise de meme pour le html

essai avec le code ci dessous et j'ai remplacé visibility par display


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans titre</title>
<script language="Javascript">
// ==================
// Activations - D?ctivations
// ==================
function GereControle(Controleur, Controle) {

document.getElementById(Controle).style.display=(Controleur=='radio_10')?'block':'none';

}
</script>
</head>

<body>

<table width="568" border="0">
        <tr>
          <td width="65">Assure</td>
          <td width="70"><input type="radio" id="radio_10" name="radios_0" onClick="GereControle('radio_10', 'liste_10');" CHECKED> <label for="radio_10">Oui</label></td>
          <td width="419"><input type="radio" id="radio_20" name="radios_0" onClick="GereControle('radio_20', 'liste_10');"> <label for="radio_20">Non</label></td>
        </tr>
      </table>
<div id="liste_10">


<div style="position: absolute; top: 100px; left: 14px; height: 347px;">
  <table width="1003" height="203" border="0" align="center" bgcolor="#FFFFFF">
    <tr>
      <td colspan="4"></td>
    </tr>
    <tr>
      <td width="210"><span class="Style13">Nom assurance</span></td>
      <td colspan="3"><input name="nom_assurance" type="text"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/></td>
    </tr>
    <tr>
      <td><span class="Style13">Nom Soci?</span></td>
      <td colspan="3"><input name="nom_societe" type="text" size="50"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/></td>
    </tr>
    <tr>
      <td><span class="Style13">Nom de l'assur?span></td>
      <td colspan="3"><input name="nom_assure" type="text"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/></td>
    </tr>
    <tr>
      <td><span class="Style13">Num? de carte d'assurance:</span></td>
      <td colspan="3"><input name="num_carte" type="text"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/></td>
    </tr>
    <tr>
      <td><span class="Style13">Plafond</span></td>
      <td width="168"><span class="Style7">
        <input name="plafond" type="text"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/>
      </span></td>
      <td width="89"> </td>
      <td width="382"> </td>
    </tr>
    <tr>
      <td>Taux de couverture:</td>
      <td colspan="3"><span class="Style7">
        <select name="taux"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'>
          <option>0</option>
          <option>1</option>
          <option>2</option>

        </select>
      %</span></td>
    </tr>
    <tr>
      <td><span class="Style13">Tiers payant: </span></td>
      <td colspan="2"><input name="tiers" type="text"  style='background-color: #99CC00; color: #FFFFFF; font-weight: bold; border-width: 1px; font-size:12pt'/></td>
      <td> </td>
    </tr>
    </table>
</div></div>
</body>
</html>

pas besoin de plus ?
rien ne sert de courir il faut partir a point.
cours Forest cours !

msi79 · Answer 5 · 2014-12-08T19:35:33+0100

Réponse 5 / 6

msi79

Messages postés: 500
Date d'inscription: lundi 24 août 2009
Statut: Membre
Dernière intervention: 13 avril 2021

1
8 déc. 2014 à 19:35

bonsoir je viens de tester votre solution mais je retombe sur le même résultat qu'auparavant.

lorsque j accède a la page le formulaire s'affiche directement or moi je veux que tant qu'on ne coche pas oui ça ne doit pas s'afficher .

@karamel · Answer 6 · 2014-12-08T20:46:03+0100

Réponse 6 / 6

@karamel

Messages postés: 1787
Date d'inscription: vendredi 9 mai 2008
Statut: Non membre
Dernière intervention: 9 juin 2021

131
Modifié par kazma le 8/12/2014 à 21:10

il faut mettre le div qui contient le formulaire en display none pour qu'il ne soit pas affiché au chargement de la page

<div id="liste_10" style="display:none">

et ne met pas met pas le bouton oui en checked c'est inutile

<td width="70"><input type="radio" id="radio_10" name="radios_0" onClick="GereControle('radio_10', 'liste_10');"> <label for="radio_10">Oui</label></td>

rien ne sert de courir il faut partir a point.
cours Forest cours !

Votre réponse