PHP/JS: Javascript code werkt niet in IE :s.

[yannick]

Ik heb dus een minuscuul stukske code geschreven om er voor te zorgen dat bij het aanklikken van een bepaalde checkbox er een inputveld naast komt (dus van type="hidden" wordt type="text").

Allemaal heel tof, werkt perfect in firefox. Maar in IE slaagt het totaal mis (alles btw op de site, IE sucked wel ).

<script language="javascript" type="text/javascript"> 

function test(frm){ 
	if (!frm.Andere.checked) { 
		frm.Anderebox.type="hidden"; 
	} 
	else{ 
		frm.Anderebox.type="text";
	}
} 

</script>

Tis is het input veld:

<input type="checkbox" name="Andere" onclick="test(this.form)" value="ja"/>

Hoe kan ik ervoor zorgen dat mensen die Internet explorer nog gebruiken (Shame on them ) dit ook kunnen gebruiken?

mvg
Yannick Welens

[RpR]

denk dat je in ie niet van hidden naar text kunt geraken en dat je zal moeten werken met het style element en zo verbergen en terug tonen.

[yannick]

heb het me ne span gdn en innerHTML. Het werkt nu in IE, maar niet meer in firefox :@

[orez]

niet met innerHTML met STYLE ELEMENTS zoals reaper zei..

[Smoerf]

Nodes in je Dom tree aanmaken doe je nog altijd met createElement. Dan appenChild aan je parent element.

voor jou probleem is het natuurlijk beter om gewoon even de style te switchen

Hier vind je een werkend voorbeeld:
http://joggink.be/wupload/_tn/yannick/

css:

<style type="text/css">

input.hide{
	display:none;
}

</style>

javascript

<script type="text/javascript">

function showInput(){

   var ac = document.getElementById('andere');
   var ai = document.getElementById('anderebox');
	
	if (ac.checked){
	   ai.className = '';
	}else{
		ai.className = 'hide';
	}

}

</script>

[yannick]

Nodes in je Dom tree aanmaken doe je nog altijd met createElement. Dan appenChild aan je parent element.

voor jou probleem is het natuurlijk beter om gewoon even de style te switchen

Hier vind je een werkend voorbeeld:
http://joggink.be/wupload/_tn/yannick/

css:

<style type="text/css">

input.hide{
	display:none;
}

</style>

javascript

<script type="text/javascript">

function showInput(){

   var ac = document.getElementById('andere');
   var ai = document.getElementById('anderebox');
	
	if (ac.checked){
	   ai.className = '';
	}else{
		ai.className = 'hide';
	}

}

</script>

Macheert ni in IE . Toch ni op mijn IE (de 6 dus).

Kheb het ander opgelost

function test(frm){ 
	if (document.compatMode && document.all)
	{
		if (!frm.Andere.checked) { 
			document.getElementById("anderebox").innerHTML="<input id='testje' type='hidden' name='Anderebox' size='15' align='absmiddle' />"; 
		} 
		else{ 
			document.getElementById("anderebox").innerHTML="<input id='testje' type='text' name='Anderebox' size='15' align='absmiddle' />"; 
		}
	}
	if (Array.every){
		if (!frm.Andere.checked) { 
			frm.Anderebox.type="hidden"; 
		} 
		else{ 
			frm.Anderebox.type="text"; 
		}
	}
}

Door te kijken of deze methodes en objects true zijn weet ik welke browser de gebruiker hanteerd. Hierdoor kan ik dus op inspelen door 2 versier te maken (eventueel 3 of 4 als ik der zin in heb, voor opera en/of ie7 )

Mvg

[Smoerf]

en als je ipv ac.checked doet ac.value == 'ja'