Rechercher : dans
Par :

[HTML]. Style visibility (Hidden-Visible)

Dernière réponse le 26 jui 2005 à 14:01:41 Effer, le 18 jui 2005 à 09:36:29 
 Signaler ce message aux modérateurs

Bonjour tous le monde.
Je suis en train de réaliser un site Intranet et je cherche comment faire pour faire apparaître ou non certaine partie d'une de mes pages. Je m'explique : J'ai 4 boutons radios, et suivant celui qui est coché certaines lignes du formulaires disparaissent et d'autres apparaissent.
Besoin d'un coup de main. Merci.

Meilleures réponses pour « [HTML]. Style visibility (Hidden Visible) » dans :
Différence entre display:none et visibility:hidden Voir Les deux attributs CSS display:none et visibility:hidden permettent tous deux de masquer l'affichage d'un élément en CSS dans le navigateur. Néanmoins, il existe une subtile nuance : visibility: hidden rend le bloc concerné invisible....
Les classes de style (CSS) VoirLes classes et les ID Les classes Il peut s'avérer intéressant d'affecter des styles différents à des mêmes balises. Pour cela les spécifications CSS ont introduit le concept de classe. La définition des classes est aussi simple que celles des...
Les balises de style VoirQu'est-ce qu'une balise de style? Les balises de style modifient la typographie du texte. Elles peuvent être imbriquées dans d'autres balises de style de la même façon qu'on le ferait avec un traitement de texte. Voici une liste de balises de...
DHTML - La notion de couche VoirQu'est-ce qu'une couche? Le DHTML est basé sur une fonctionnalité provenant de la norme 4.0 du HTML: les feuilles de style en cascade de positionnement, aussi appelée CSS-P (Cascading Style Sheets Positionning). Celles-ci permettent de définir des...

1

nico7382, le 18 jui 2005 à 10:32:08
  • +2

Salut,

pour cela il faut ajouter du code javascript

Répondre à nico7382

2

 HackTrack, le 26 jui 2005 à 14:01:41
  • +2


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<!--
	Author: Philippe FERY
	Date: 26 Jul 05
-->

<head>
	<title>Untitled</title>
	<script language="javascript" type="text/javascript">
	  var allFields = new Array("lastname","firstname","society","vat","soctype");
	  var validFields = new Array(new Array(2,3,4),new Array(0,1),new Array(0,1,3));
	  
	  function updateForm(value){
	    document.getElementsByName("view")[0].style.display="block";

		for(i=0 ; i<allFields.length; i++){  
		  fieldDiv=document.getElementsByName("tr_"+ allFields[i])[0];	
	      fieldDiv.style.display="none";
		  for(j=0 ; j<validFields[value].length ; j++){
		    if(validFields[value][j]==i){
			 window.status+=allFields[i]+" ";
			  fieldDiv.style.display="block";
		  }			
		 }
		}
	  }
	</script>
</head>

<body>
 <fieldset>
    <legend>Qui êtes vous?</legend>
    <table>
	  <tr>
	    <td>
  		  Société:
		</td>
	    <td>
  		  <input type="radio" name="type" value="0" onclick="updateForm(this.value);"/>
		</td>
	  </tr>
	  <tr>
	    <td>
  		  Personne privée (sans n°de TVA):
		</td>
	    <td>
  		  <input type="radio" name="type" value="1" onclick="updateForm(this.value);"/>
		</td>
	  </tr>	 
	  <tr>
	    <td>
  		  Personne privée (avec n°de TVA):
		</td>
	    <td>
  		   <input type="radio" name="type" value="2" onclick="updateForm(this.value);"/>
		</td>
	  </tr>	   
	</table>
  </fieldset>	


  <fieldset name="view" id="view" style="display:none;">
  <legend>Formulaire d'inscription</legend>
  <form name="detailform" method="POST" action="http://www.someServer.com">
    <table>
	  <tr><td><div id="tr_lastname">
      <table>	
	  <tr>
	    <td>
  		  Nom:
		</td>
	    <td>
  		  <input type="text" name="lastname" />
		</td>
	  </tr>
      </table>	
	  </div></td></tr>
	  
	  <tr><td><div id="tr_firstname">
      <table>	
	  <tr>
	    <td>
  		  Prénom:
		</td>
	    <td>
  		  <input type="text" name="firstname" />
		</td>
	  </tr>
      </table>	
	  </div></td></tr>
	  
	  <tr><td><div id="tr_society" >
      <table>		  
	  <tr>
	    <td>
  		  Société:
		</td>
	    <td>
  		  <input type="text" name="society" />
		</td>
	  </tr>
      </table>		  
	  </div></td></tr>
	  
	  <tr><td><div id="tr_vat" name="tr_vat" >
      <table>		  
	  <tr>
	    <td>
  		  N° TVA:
		</td>
	    <td>
  		  <input type="text" name="vat" />
		</td>
	  </tr>
      </table>		  
	  </div></td></tr>	 
	  
	  <tr><td><div id="tr_socType">
      <table>		  
	  <tr>
	    <td>
  		  Raison sociale:
		</td>
	    <td>
  		  <select name="socType">
		  		  <option value="SA"/>Société Anonyme
				  <option value="SPRL"/>SPRL				  
				  <option value="PME"/>PME
		  </select>
		</td>
	  </tr>
      </table>		  
	  </div></td></tr>		    
	</table>
	<table><tr><td><input type="submit" value="Envoyer"/></td><td><input type="reset" value="Effacer"/></td></tr></table>
  </form>
  </fieldset>	  
</body>
</html>


;-)
HackTrack

Répondre à HackTrack