Javascript Progger frage

Beitrag von **ich61** » 06.02.2008, 19:22

Ich möchte mit Javascript ein eingabefeld was ich nicht benötige ausblenden lassen.

Um das Feld auszublenden muss ich in einem Anderen Auswahlmenü erst wählen zwischen Aktiv und Inaktiv.Wähle ich Aktiv soll das Eingabe feld erscheinen.Bei Inaktiv soll es ausgeblendet werden.

So nun habe ich folgenden Javascript code verwendet

Code: Alles auswählen

<script type="text/javascript">
window.onload = test;


function test&#40;&#41; &#123;



var vari = <?php echo $etap ?>;


           if&#40;vari == 0&#41;
		   
		    &#123;
			
			document.getElementById&#40;"v10"&#41;.style.visibility="hidden";document.getElementById&#40;"v100"&#41;.style.visibility="hidden";
	
			&#125;
			
			else
			
			&#123;
			
			
			document.getElementById&#40;"v10"&#41;.style.visibility="visible";document.getElementById&#40;"v100"&#41;.style.visibility="visible";
			
			&#125;
			&#125;
			

function setsite&#40;&#41;
		&#123;
			// Je nach gewählten Produkt wird der Einzelpreis festgelegt
			var index = document.forms&#91;0&#93;.elements&#91;"v11"&#93;.selectedIndex;
			
			if&#40; index < 1 &#41;
				return;
				
				
			switch&#40;index&#41;&#123;
			 case 2&#58; document.getElementById&#40;"v10"&#41;.style.visibility="hidden";document.getElementById&#40;"v100"&#41;.style.visibility="hidden"; break;
			 case 1&#58; document.getElementById&#40;"v10"&#41;.style.visibility="visible";document.getElementById&#40;"v100"&#41;.style.visibility="visible"; ;break;
		     &#125;
			
		&#125;
		
		</script>

Und das ist der passende php Teil dazu

Code: Alles auswählen

if &#40;$etap == 1&#41;&#123;



$e_stat = '<option>Waehlen...</option>

<option value="1" selected>Aktiv</option>



          <option value="0">Inaktiv</option>';



&#125; else



&#123;    $e_stat = '<option>Waehlen...</option><option value="1">Aktiv</option>



               <option value="0" selected>Inaktiv</option>';



			   &#125;

Der funktioniert zwar nur das Problem an diesem code ist das ich 3 Optionen brauche.Also habe ich in meinem Auswahl feld nun Aktiv,Inaktiv und noch eine dritte Auswahl ich nenn sie einfach mal Wählen stehen.

Wie kann ich jetzt die dritte Auswahl (Wählen) entfernen???Ich bekomms einfach nicht hin.Die Option ist total überflüssig aber nehm ich die raus wird das Eingabefeld nicht mehr ausgeblendet.

Ich hoffe Ihr habt mich einigermaßen verstanden.

von **Anzeige von ABAKUS** »

Beitrag von **Planet-Bloody** » 06.02.2008, 20:00

Wenn ich dein Problem jetzt richtig verstanden haben, dann musst du folgendes tun:

Im Javascript Teil in der Funktion setsite() wird in die Variable index das ausgewählte Element geschrieben. Derzeit besitzt zu 3x <option> sprich Index kann folgende Werte besitzen 0,1,2

0 = Waehlen
1 = Aktiv
2 = Inaktiv

löscht du jetzt wählen, dann ändern sich die Werte welche du in die Variable index schreibst, sprich 0 = Aktiv, 1 = Inaktiv

Wählst du daher Aktiv aus, springt er direkt in der Funktion setsite() raus, da index < 1 ist, wählst du jetzt Inaktiv aus dann läuft er in die switch-Anweisung mit dem Wert 1, welcher deine Textbox immer auf visible setzt.

Beitrag von **ich61** » 06.02.2008, 20:07

Hm?Ok aber was muss ich genau ändern?Ich blick da nicht durch kannste mir das mal abgeändert zeigen??

von **Anzeige von ABAKUS** »

Beitrag von **Planet-Bloody** » 06.02.2008, 20:47

Ich habe deine Funktion setsite(); etwas umgebaut, da ich sie für sehr unflexibel halte:

Code: Alles auswählen

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="de">
<head>
	<title>JavaScript Text</title>
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
	<script type="text/javascript">
	
	function setsite&#40;&#41; &#123;
		
		// Ids der Textboxen, welche verschwinden bzw. angezeigt werden sollen
		var TextBoxId1 = 'text1';
		var TextBoxId2 = 'text2';
		
		// Id des <select> Auswahlfeldes
		var SelectId = 'select1';

		// Speichert die aktuelle value des ausgewählten Elements	
		var index = document.getElementById&#40;SelectId&#41;.options&#91;document.getElementById&#40;SelectId&#41;.selectedIndex&#93;.value;
		
		switch &#40;index&#41; &#123;
			
			case '1'&#58;	document.getElementById&#40;TextBoxId1&#41;.style.visibility = 'visible';
						document.getElementById&#40;TextBoxId2&#41;.style.visibility = 'visible';
					break;
					
			case '2'&#58;	document.getElementById&#40;TextBoxId1&#41;.style.visibility = 'hidden';
						document.getElementById&#40;TextBoxId2&#41;.style.visibility = 'hidden';
					break;
			
		&#125;
		
	&#125;
	
	</script>
</head>
<body>
<h1>JavaScript Text</h1>
<p>Bei Auswahl aus der <em><select></em>-Box soll das nachfolgenden Input Feld verschwinden oder angezeigt werden.</p>
<select name="select1" id="select1" onchange="setsite&#40;&#41;;">
	<option>Bitte w&auml;hlen...</option>
	<option value="1">Anzeigen</option>
	<option value="2">Nicht anzeigen</option>	
</select>
<br><br><br>
<input type="text" name="text1" value="Textbox" id="text1" size="20">
<input type="text" name="text2" value="Textbox" id="text2" size="20">
</body>
</html>

in der Variable index in der Function setsite() wird jetzt nicht mehr die Position des <option>-Feldes in der Auswahlleiste gespeichert, sondern die value des ausgewählten <option>-Feldes. Wo durch du hinzufügen und löschen kannst, soviel du willst solange eine <option> value mit 1 und mit 2 vorhanden ist, welche die Anzeige der Textboxen steuern.

Sprich wenn du <option>Bitte wählen...</option> löscht funktioniert alles noch einwandfrei.

Beitrag von **ich61** » 06.02.2008, 21:55

Danke adanke für deine hilfe hast mir sehr geholfen ich habs jetzt hinbekommen