[ vladimirn @ 28.11.2007. 09:39 ] @
Zanima me kako da uradim promenu vidljivosti za div.

divove popunjavam vrednostima iz baze i pored svake vrednosti stavljam checkbox.
Vrednosti su sortirane u kategorije i podkategorije. Kada kliknem na glavnu kategoriju, odnosno na check box pored nje, zelim da mi se ispod nje otvore njene podkategorije, odnosno DIV u kojem se one nalaze a koji je inicijalno HIDDEN.
Napravio sam ovo ispod, ali obzirom da se pojavi vise id-ova koji imaju isto ime, samo prvi DIV sa tim id-om postane vidljiv.

izguglao sam i getElementsByClass, getElementsByName itd.. ali nikako nisam u dobrim odnosima sa javascriptom i ne znam kako da iskoristim to za ovo sto meni treba.


Code:

<div class='1'>
    Knjizevnost<input type='checkbox' value='1' onClick="javascript:document.getElementById('subcat1').style.visibility = 'visible';">
        <div style='margin-left:8px;visibility:hidden;height:1px;' id='subcat1'>
            Domaca Knjizevnost<input type='checkbox' value='8' >
            <div style='margin-left:8px;visibility:hidden;height:1px;' id='subcat8'>Romani<input type='checkbox' value='10' ></div>
            <div style='margin-left:8px;visibility:hidden;height:1px;' id='subcat8'>Poezija<input type='checkbox' value='12' ></div>
        </div>
        <div style='margin-left:8px;visibility:hidden;height:1px;' id='subcat1'>Strana knjizevnost<input type='checkbox' value='9' >
            <div style='margin-left:8px;visibility:hidden;height:1px;' id='subcat9'>Romani<input type='checkbox' value='11' ></div>
            <div style='margin-left:8px;visibility:hidden;height:1px;' id='subcat9'>Poezija<input type='checkbox' value='13' ></div>
        </div>
</div>


Ili neka druga ideja ?
[ jablan @ 28.11.2007. 09:43 ] @
Dva elementa ne smeju imati isti ID, tako da probaj da rešiš taj problem prvo.

Takođe, za ovakve stvari nije loše da koristiš neku javaskript biblioteku tipa jQuery.
[ vladimirn @ 28.11.2007. 10:30 ] @
Poznato mi je da dva elementa ne smeju imati isti id.
Citat:

Dva elementa ne smeju imati isti ID, tako da probaj da rešiš taj problem prvo.


zato sam i postavio pitanje i trazio pomoc :) Ne umem da ga resim, a ne znam da li postoji neko resenje kroz getElelmentsByClass ili Name ili nesto trece.

koji god atribut da koristim, id, name, class... u okviru jedne kategorije ja ga kreiram na osnovu ID kategorije u kojem se nalazi. Ispred broja dodajem rech 'subcat' pa onda dobijem u okviru kategorije 1 divove koji se zovu subcat1, u okviru kategorije 2 divove sa imenom subcat2 i tako dalje...

Moje pitanje je dal i postoji resenje da se odredjen skup DIVOVA jednim klikom na check box ucini vidljivim ili nevidljivim :)
[ vladimirn @ 28.11.2007. 13:38 ] @
Evo kako sam resio:

Code:

function getElementsByClass( searchClass, domNode, tagName) {
    if (domNode == null) domNode = document;
    if (tagName == null) tagName = '*';
    var el = new Array();
    var tags = domNode.getElementsByTagName(tagName);
    var tcl = " "+searchClass+" ";
    for(i=0,j=0; i<tags.length; i++) {
        var test = " " + tags[i].className + " ";
        if (test.indexOf(tcl) != -1)
            el[j++] = tags[i];
    }
    return el;
}
function showDiv(divname) 
{
var tabname;

    var tabs = getElementsByClass(divname);
    for(i=0; i<tabs.length; i++){
        tabs[i].style.display = 'block';
        tabs[i].style.height = '100%';
    }
    
}


Usage:
<input type="checkbox" onClick="showDiv(mojaKlasa)">
gde mi je div class dinamiscki generisan kroz ID koji svaka kategorija ima a koju izvlacim php-om.
Svi divovi koji imaju class="mojaKlasa" postaju vidljivi