login  Naam:   Wachtwoord: 
Registreer je!
 Forum

show/hide select

Offline Ultimatum - 27/11/2006 13:56 (laatste wijziging 27/11/2006 14:16)
Avatar van UltimatumPHP expert Mijn select heeft 4 opties (thuis/uit/inhaal/uit) en ik wil als je op uit/inhaal of uit drukt dat er dan een bepaald formulier uit komt rollen. Alleenals ik uit kies dan krijg ik ook keurig de tekst uit (als test) maar kies ik daarna inhaal (bijvoorbeeld als ik een foute keuze heb gemaakt) dan krijg ik inhaal te zien, maar het staat onder de tekst uit. De tekst uit moet dus verdwijnen en plaats maken voro de nieuwe tekst.

Javascript
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <script language='Javascript'>
  2.       function showorhide(id) 
  3.       {
  4.         if (document.getElementById(id).style.display == "none") 
  5.         {
  6.           document.getElementById(id).style.display = "block";
  7.         } 
  8.         else 
  9.         {
  10.           document.getElementById(id).style.display = "none";
  11.         }
  12.       }  
  13.     </script>


http://plaatscode.be/3228/

Nog een vraag: Als ik bijvoorbeeld uit kies dan moeten de velden strippen en rijders verschijnen en als die niet ingevuld is moeten daarvoor errors komen en anders niet.. Maar als ik nu op de buton druk dan springt hij weer terug op thuis (standaard) en verdwijnen die 2 velden

n.b. De javascript code word op de index geinclude en de velden verdwijnen en verschijnen wel..

4 antwoorden

Gesponsorde links
Offline Thomas - 27/11/2006 14:28 (laatste wijziging 27/11/2006 14:29)
Avatar van Thomas Moderator Eigenlijk wil je een functie die alle divs (er vanuitgaande dat je divs gebruikt) met bepaalde id's verbergt, behalve een specifiek id.

Ik gebruik hier 3 functies voor:
php code - Bekijk de code zonder highlighting - Klap code in 
  1. // show or hide one div
  2. function showdiv(thediv, show)
  3. {
  4. 	var div = document.getElementById(thediv);
  5.  
  6. 	if(div != null)
  7. 	{
  8. 		div.className = (show) ? "show" : "hide";
  9. 	}
  10. }
  11.  
  12. // show or hide multiple divs
  13. function showdivs(alldivs, show)
  14. {
  15. 	for(div in alldivs)
  16. 	{
  17. 		showdiv(alldivs[div], show);
  18. 	}
  19. }
  20.  
  21. // show a single div (id) from an array of divs (ids)
  22. function showlayer(id, ids)
  23. {
  24. 	showdivs(ids, false);
  25. 	showdiv(id, true);
  26. }


en een stukje CSS:
php code - Bekijk de code zonder highlighting - Klap code in 
  1. .show
  2. {
  3. 	display: inline;
  4. 	visibility: visible;
  5. }
  6.  
  7. .hide
  8. {
  9. 	display: none;
  10. 	visibility: hidden;
  11. }


Voor het schakelen van die ene specifieke div die je wilt tonen gebruik je showlayer().
Offline Ultimatum - 27/11/2006 16:35
Avatar van Ultimatum PHP expert Deze doet precies hetzelfde als die ik al had. Als ik een 2de keuze uit de dropdown laat zien laat hij de 2de + eerste keuze zien ipv alleen die eerste..

Heb het nu zo:
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <select name='soort' size='1' class='select' onChange="showlayer(this.value)">        
  2.         		<option value='thuis'>Thuis</option>
  3.         		<option value='uit'>Uit</option>
  4.         		<option value='inhaal'>Inhaal</option>
  5.         		<option value='vrij'>Vrij</option>   		        		        		        		
  6.         	</select>


en op de tabellen zit id='uit'/id='inhaal' etc.. en een class='hide'
Offline Thomas - 27/11/2006 16:52 (laatste wijziging 27/11/2006 16:53)
Avatar van Thomas Moderator showlayer heeft 2 parameters:
id: de id die je wilt tonen

ids: een array van id's (waaronder de bovengenoemde "id") die niet getoond worden.

Voorbeeld:

php code - Bekijk de code zonder highlighting - Klap code in 
  1. <script type="text/javascript">
  2. var layers = new Array("aap", "noot", "mies");
  3. </script>
  4.  
  5. form hier
  6. ...
  7. <select onchange="showlayer(this.value, layers)">
  8. <option value="">kies:</option>
  9. <option value="aap">aap</option>
  10. <option value="noot">noot</option>
  11. <option value="mies">mies</option>
  12. </select>
  13. ...
  14.  
  15. <div id="aap" class="hide">aap</div>
  16. <div id="noot" class="hide">noot</div>
  17. <div id="mies" class="hide">mies</div>
Offline Ultimatum - 27/11/2006 16:59 (laatste wijziging 27/11/2006 17:03)
Avatar van Ultimatum PHP expert Hey... hij werkt 

Maar er is nog 1 klein dingetje..

Stel ik submit het formulier en ik heb de optie uit gekozen dus er zijn 2 extra velden. Als ik nu submit en vergeet iets in te vullen, dan word mijn select weer terug gezet naar thuis en dan zijn de 2 velden weer weg. Is het mogelijk dat als ik uit heb gekozen hij ook op uit blijft staan?
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.205s