[javascript/php] hidden/visible getElementById probleem

[Verwijderd]

Om een div zichtbaar te maken en de ander hidden gebruik ik getElementById in javascript. Nou wil ik hierbij een id aanroepen die variabel is. Op dit moment heb ik het volgende gedaan maar wordt het id niet meegenomen, var divs = document.getElementById($var_id);

Hoe kan ik een id variabel wat ik doormiddel van een mysql opdracht uit een database halen aanroepen in deze javascript code?

code:

<script language=javascript type='text/javascript'>
    function showdiv(pass) {

  var divs = document.getElementById($var_id);  
    //  var divs = document.getElementsByTagName('div');
        for(i=0;i<divs.length;i++){
         if(divs[i].id.match(pass)){//if they are 'see' divs
          if (document.getElementById) // DOM3 = IE5, NS6
          divs[i].style.visibility="visible";// show/hide
         else
        if (document.layers) // Netscape 4
        document.layers[divs[i]].display = 'visible';
        else // IE 4
        document.all.divs[i].visibility = 'visible';
        } else {
        if (document.getElementById)
        divs[i].style.visibility="hidden";
        else
        if (document.layers) // Netscape 4
        document.divs[i].visibility = 'hidden';
        else // IE 4
        document.all.divs[i].visibility = 'hidden';
       }
      }
     }
    </script>

code:

<? 
 $sql = "SELECT * FROM opdrachtgevers ORDER BY naamopdrachtgever ASC";
 $query = mysql_query($sql);
 while($rij = mysql_fetch_object($query)) {
  $var_id = htmlspecialchars($rij->id);
  $var_opdrachtgever = htmlspecialchars($rij->naamopdrachtgever);
  $var_omschrijving = htmlspecialchars($rij->omschrijving);
  $var_website = htmlspecialchars($rij->website);

   echo "<table border=\"0\">\n";   
     
   echo "<tr>\n";
   echo "<td><img src=\"afbeelding.php?id=" . $var_id . "\"></td>\n"; 
   echo "</tr>\n"; 
   
 //  echo "<tr>\n";
  // echo "<td><p><b>" . $var_opdrachtgever . "</b></p></td>\n";
  // echo "</tr>\n";
   
   echo "<tr>\n";
 ///echo "<td><a href=\"javascript:showdiv('". $var_id ."')\">" . $var_opdrachtgever . "</a></td>\n";
  echo "<td><div onclick=\"showdiv('".$var_id ."')\">" . $var_opdrachtgever . "</div></td>\n";   
   echo "</tr>\n";  
   echo "</table><br/>\n";
  }
?>

[Verwijderd]

Ik weet niet precies wat je bedoelt maar werkt dit misschien?

var divs = document.getElementById(<? echo $var_id; ?>);

[MueR]

Ik zou in ieder geval beginnen door je divs een ID mee te geven. Op naam matchen is toch niet zo efficient als unieke IDs.

[P.O. Box]

ten tweede haal je php en javascript door elkaar.... javascript kent geen variabelen die met een $ beginnen....

[Verwijderd]

Edwardvb schreef op vrijdag 11 mei 2007 @ 22:54:
ten tweede haal je php en javascript door elkaar.... javascript kent geen variabelen die met een $ beginnen....

daarom stelde ik voor om de php var in js te echo-en

[Verwijderd]

Verwijderd schreef op vrijdag 11 mei 2007 @ 20:42:
Ik weet niet precies wat je bedoelt maar werkt dit misschien?

var divs = document.getElementById(<? echo $var_id; ?>);

Dit werkt ieder geval niet. Dan gebeurt er niks..

[Verwijderd]

MueR schreef op vrijdag 11 mei 2007 @ 22:27:
Ik zou in ieder geval beginnen door je divs een ID mee te geven. Op naam matchen is toch niet zo efficient als unieke IDs.

Dat is juist m'n bedoeling

[Verwijderd]

Je doet een getElementById, wat dus 1 uniek element teruggeeft, en vervolgens behandel je deze als een array door er doorheen te willen loopen. Dat werkt dus niet Daarnaast zit de id van je div in de variabele 'pass' in je functie, maar hier doe je vervolgens niets mee.

Van al je verdere browserchecks snap ik niets, zeker niet zonder fatsoenlijk inspringende code. Misschien kun je hier iets aan doen om het duidelijker te maken? Begin daarnaast eens gewoon met het werkend te maken voor een recente browser (zonder die checks dus), en bouw het vanaf daar uit.

[ Voor 54% gewijzigd door Verwijderd op 12-05-2007 08:54 ]

[Verwijderd]

Het werkt wel als ik dit gebruikt:

var divs = document.getElementsByTagName('div')

alleen dan pakt hij alle divs. nou probeer ik dus met id het voor elkaar te krijgen... vroeg me af of iemand me daarmee kan helpen. ik begrijp dat het dus zo niet kan. maar hoe dan wel?

[Joolee]

code:

<script language=javascript type='text/javascript'>
    function showdiv(pass) {

  var divs = document.getElementById($var_id);

Hier roep je in javascript een php variable aan. Dat gaat natuurlijk niet werken. Je hebt met php de variable al geëcho'd in de aanroep van de functie. Je roept dus showdiv('id') aan. Dan moet je in je Javascirpt function ook gewoon de Javascript variable gebruiken. In dit geval pass. Verder moet je het resultaat van getElementById ook niet behandelen als een Array.

[Verwijderd]

[b][message=28019863,noline]klaasp1984 schreef op zaterdag 12 mei 2007 @

alleen dan pakt hij alle divs. nou probeer ik dus met id het voor elkaar te krijgen... vroeg me af of iemand me daarmee kan helpen. ik begrijp dat het dus zo niet kan. maar hoe dan wel?

Met alle respect, lees eens iets over JS op www.w3schools.com ofzo. Het is echt nodig om de basis te kennen (objecten, array's, etc) wil je dit op kunnen lossen.

Je kunt een enkel object niet als een array behandelen, en je zult moeten weten hoe je een parameter (in dit geval 'pass') binnen je functie gebruikt.

[Verwijderd]

Op dit moment lukt het me om de omschrijving zichtbaar te maken na te klikken op een bedrijf.
Maar het is de bedoeling dat wanneer je op een andere bedrijfsnaam aan de rechterkant klikt de andere omschrijving verdwijnt en de nieuwe zichtbaar wordt. http://engelen.vigourmedia.nl/opdrachtgevers.php

Ik gebruik nu dit:

code:

    <script language=javascript type='text/javascript'>
    function showdiv(pass){
    
    var t=document.getElementById(pass)

    if(t.style.visibility=='hidden'){
    t.style.visibility='visible';
    }else{
    t.style.visibility='none';
    }
}

Ik probeer het door middel van een extra div die main heet met deze code, maar dan gebeurt er helemaal niks meer. Iemand de oplossing? zou super zijn

code:

    <script language=javascript type='text/javascript'>
    function showdiv(pass){
    
var divs = main.getElementsByTagName('div');        
    var t=document.getElementById(pass)

    document.all.divs.visibility ='hidden';

    if(t.style.visibility=='hidden'){
    t.style.visibility='visible';
    }else{
    t.style.visibility='none';
    }
}

[P.O. Box]

Verwijderd schreef op woensdag 16 mei 2007 @ 11:35:
Op dit moment lukt het me om de omschrijving zichtbaar te maken na te klikken op een bedrijf.
Maar het is de bedoeling dat wanneer je op een andere bedrijfsnaam aan de rechterkant klikt de andere omschrijving verdwijnt en de nieuwe zichtbaar wordt. http://engelen.vigourmedia.nl/opdrachtgevers.php

Ik gebruik nu dit:
[code]
..

Er klopt geen ene hout van je code....
als je alle divs wilt verbergen, zul je langs alle divs moeten loopen ...
de variable divs is al een verwijzing naar een (array) element... document.all ervoor zetten lijkt me dan niet de bedoeling...
google eens op het loopen door html elementen... gebruik bijv. termen als: while getElementByTagName etc.

[ Voor 31% gewijzigd door P.O. Box op 16-05-2007 12:39 ]

[Verwijderd]

Edwardvb schreef op woensdag 16 mei 2007 @ 12:39:
[...]
als je alle divs wilt verbergen, zul je langs alle divs moeten loopen ...

Dit is ook niet de bedoeling..als je goed leest

[P.O. Box]

Verwijderd schreef op woensdag 16 mei 2007 @ 13:36:
[...]


Dit is ook niet de bedoeling..als je goed leest

dat is wel je bedoeling... je wil alle div's verbergen, en daarna weer de juiste laten zien...

althans, zo omschrijf je het, en dat poogt je code ook....

[ Voor 10% gewijzigd door P.O. Box op 16-05-2007 14:16 ]

[Verwijderd]

ik wil alleen div met het id-main verbergen en laten oproepen als de div daarbinnen in het juiste id heeft.

[P.O. Box]

Dit is de code van je website...

HTML:

<div id="main">
<div id="6" style="border: 1px none #000000; visibility: hidden"></table>
<tr>
<td><p><b>ABN AMRO</b></p></td>
</tr>
<tr>
<td><p>U hebt een goed idee voor een eigen zaak? Dat steunen wij graag. Daarom bieden wij u een aantal goede producten, een groot netwerk en handige en nuttige zaken voor u als enthousiaste, beginnende ondernemer.</p></td>
</tr>
<tr>
<td><a target="_blank" href=http://www.abnamro.nl>www.abnamro.nl</a></td>
</tr>
</table><br/>
 </div>
 </div>
<div id="main"><div id="4" style="border: 1px none #000000; visibility: hidden"></table>
<tr>
<td><p><b>Medisch Centrum Leeuwarden (2003) </b></p></td>
</tr>
<tr>
<td><p>'De directie van het MCL wilde inzicht hebben in de financiële consequenties van cardiothoracale chirurgie. Er was daarom behoefte aan een onafhankelijke rapportage. Als adviseur maakte Peter Engelen een rapportage voor directie en medische staf, waaruit de financiële haalbaarheid van de cardiochirurgie bleek en de inhoudelijke risico&#8217;s zichtbaar werden.</p></td>
</tr>
<tr>
<td><a target="_blank" href=http://www.mcl.nl>www.mcl.nl</a></td>
</tr>
</table><br/>
 </div>
 </div>
<div id="main">
    <div id="2" style="border: 1px none #000000; visibility: hidden">
        </table>
        <tr>
        <td><p><b>Rabobank</b></p></td>
        </tr>
<tr>
<td><p>Als klant van de Rabobank kunt u met de nieuwe Rabocard meewerken aan een beter klimaat. Als u met de kaart betaalt, investeren wij een bedrag in een klimaatproject. Alle projecten selecteren we in nauwe samenwerking met het Wereld Natuur Fonds.</p></td>
</tr>
<tr>
<td><a target="_blank" href=http://www.rabobank.nl>www.rabobank.nl</a></td>
</tr>
</table><br/>
 </div>
 </div>

waarom doe je <div id="main"><div id="x" ... >blabla</div></div>

die div id=main heeft echt geen enkel nut zo.... en een id dat uit enkel een nummer bestaat zou ik ook niet aanraden....
in principe is het niet de bedoeling dat je meerdere div's met dezelfde id hebt... soms kan het handig zijn, maar voor wat jij wilt bereiken niet...

je zou het o.a. zo kunnen doen (en als je het echt graag wilt laat je alle 'div id="main"' staan):
<div id="opdrachtgever1" ...>blabla</div>
<div id="opdrachtgever2" ...>blabla</div>
<div id="opdrachtgever3" ...>blabla</div>

loop daarna over alle div's en controleer of de id begint met "opdrachtgever"... zo ja, dan verberg je hem, anders doe je niets....
als je dan alle div's die beginnen met opdrachtgever hebt verborgen, maak je daarna degene die je WEL zichtbaar wilt laten zijn weer visible....

PS. je tables open je ook niet goed...

[Verwijderd]

Opgelost

<script type='text/javascript'>
var previousdiv = false;
function showdiv(id) {
if (previousdiv) {
document.getElementById(previousdiv).style.display = 'none';
}
document.getElementById(id).style.display = 'block';
previousdiv = id;
}
</script>