[javascript]style.visibility='visible' werkt in niet FireFox

[Jochemmol]

Ik had een ander topic maar omdat daar niet op gereageerd werd, dit omdat de titel anders is omdat het eigenlijk een ander probleem is. Dus open ik een nieuw topic met een titel die bij het probleem past.

Ik heb een formulier aangemaakt als de gebruiker via een optionbox een keuze maakt dan moet de optionbox type gevuld worden en zichtbaar gemaakt worden.

Dat vullen doe ik doormiddel van javascript en gebruik ik een array voor. Dit werkt perfect zowel in fireFox en IE. Ik kan namelijk met een javascript alert de inhoud van het array weergeven.

Nu wilde ik op de onderstaane manier de optionbox type zichtbaar maken.

code:

document.formulier.type.style.visibility = 'visible';

Dit werkt niet in FireFox (wel in IE).

Via google vond ik de volgende manier.

code:

document.formulier.type.style.display= 'block';

Dit zou wel moeten werken voor FireFox maar helaas.

wat is hier aan de hand hoe kan ik dit probleem afvangen.

[Not Pingu]

code:

document.getElementById('type').style.visibility = 'visible';

objecten rechtstreeks met hun Name aanspreken werkt alleen in IE.

[Verwijderd]

document.forms['formulier'].elements['type'].style.etc

@hierboven: dat kan alleen als ie idd een id heeft, waarschijnlijk heeft ie alleen maar een name

[ Voor 57% gewijzigd door Verwijderd op 07-06-2005 14:06 ]

[Jochemmol]

Helaas werkt het geen van beide. Ik heb in overal alerts geplaatst om te zien tot waar het goed gaat. De enige alert die ik zie is "begin" verder komt hij niet. In IE werken alle manieren

code:

echo "<script language=\"javascript\">";
   echo "function optionbox()";
   echo "{";
      echo "alert('begin');"; 
      echo "var waardecheck;";
      echo "waardecheck = document.getElementById('keuze').value;";
      
      echo "for (var intY = 0; intY < document.forms['formulier'].elements['type'].length; intY++) {";
            echo "document.forms['formulier'].elements['type'].options[intY] = null;"; 
            echo "alert('Option leeg maken');";
      echo "}";
        
      echo "if (waardecheck == 0) {";
      echo "var IntX = 0;";
       
      echo "for (var intI = 0; intI < arrKeuze[IntX].length; intI++) {";
            echo "document.forms['formulier'].elements['type'][intI] = new Option(arrKeuze[IntX][intI]);"; 
            echo "alert('value = 0');";
      echo "}";
   echo "}";
  
   echo "else if (waardecheck == 1) {";
      echo "var IntX = 1;";
      
      echo "for (var intI = 0; intI < arrKeuze[IntX].length; intI++) {";
          echo "document.forms['formulier'].elements['type'][intI]= new Option(arrKeuze[IntX][intI]);"; 
          echo "alert('value =1);";
     echo "}";          
   echo "}";
      echo "alert('werkt');";
      echo "document.forms['formulier'].elements['type'].style.visibility = 'visible';";
      echo "alert('Zichtbaar maken');"; 
   echo "}";    
echo "</script>";

[Not Pingu]

Geef dan eens wat markup. geef je alle elementen ID's? Of alleen maar NAME attributen?

[Jochemmol]

Sorry.

Ik heb een optionbox keuze

code:

select name="keuze" id ="keuze" onchange="optionbox()">
    <option></option>
    <option value="0">Tekeningen</option>
    <option value="1">Etsen</option>

Als men die heeft geselecteerd wordt de functie optionbox() aangeroepen. in die functie (zie hierboven) wil ik de optionbox type zichtbaar te maken

code:

<select name="type" id="type" style="visibility:hidden;">

Deze heeft geen options want die options zijn dynamisch. De options moeten aangemaakt worden inde functie optionbox()

In IE werkt het allemaal.

[ Voor 18% gewijzigd door Jochemmol op 07-06-2005 15:13 ]

[Not Pingu]

Kun je wel zien of het toevoegen van options werkt? FF heeft trouwens een hele goeie Javascript console waar vast wel een foutmeldinkje opstaat: Tools -> Javascript console

[Verwijderd]

ff een gok: ik denk dat de eerste loop mis gaat om dat je elements['type'][] collection aangepast wordt op het moment dat je de options verwijderd, zodra je de 0'de hebt verwijderd, schuift alles op en wordt de 1e de 0e. Je gaat vervolgens de eerste verwijderen (2e) dus en blijft de 0e staan.

Misschien iets als

code:

while ([...].elements['type'][0]) {
//remove
}

[ Voor 7% gewijzigd door Verwijderd op 07-06-2005 15:24 ]

[crisp]

Je JS rammelt gewoon aan alle kanten; hier kom ik zo'n beetje op uit:

HTML:

<script type="text/javascript">

var arrKeuze = new Array();
arrKeuze[0] = new Array(1,2,3,4,5,6,7);
arrKeuze[1] = new Array(7,6,5,4,3,2,1);

function optionbox(kSel)
{
    alert('begin');

    var IntX = kSel.options[kSel.selectedIndex].value;

    var oSel = kSel.form.elements['type'];
    oSel.options.length = 0;
    alert('Select leeg gemaakt');

    if (arrKeuze[IntX])
    {
        alert('value = ' + IntX);
        for (var intI = 0; intI < arrKeuze[IntX].length; intI++)
        {
            oSel.options[intI] = new Option(arrKeuze[IntX][intI], arrKeuze[IntX][intI]);
        }

        alert('gevuld');

        oSel.style.visibility = 'visible';
        alert('Zichtbaar gemaakt');
    }
    else
    {
        oSel.style.visibility = 'visible';
        alert('Weer verborgen');
    }
}
</script>


<form action="#">
    <select name="keuze" onchange="optionbox(this)">
        <option></option>
        <option value="0">Tekeningen</option>
        <option value="1">Etsen</option>
    </select>
    <select name="type" style="visibility:hidden"></select>
</form>

[Jochemmol]

Ik heb hem werkend gekregen.

Bedankt allemaal.

[crisp]

Verwijderd schreef op dinsdag 07 juni 2005 @ 15:22:
ff een gok: ik denk dat de eerste loop mis gaat om dat je elements['type'][] collection aangepast wordt op het moment dat je de options verwijderd, zodra je de 0'de hebt verwijderd, schuift alles op en wordt de 1e de 0e. Je gaat vervolgens de eerste verwijderen (2e) dus en blijft de 0e staan.

Misschien iets als

code:

while ([...].elements['type'][0]) {
//remove
}

Nee, gewoon old-school de options.length op 0 zetten