[es] - kako koristiti getElementsBy za promenu styla?

vladimirn
Vladimir Nikolic
Novi Sad

Član broj: 38585
Poruke: 81
*.static.sbb.co.yu.

Profil

kako koristiti getElementsBy za promenu styla?

^{28.11.2007. u 09:39 - pre 199 meseci}

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 ?

Odgovor na temu

jablan

Član broj: 8286
Poruke: 4541

+711 Profil

Re: kako koristiti getElementsBy za promenu styla?

^{28.11.2007. u 09:43 - pre 199 meseci}

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.

Odgovor na temu

vladimirn
Vladimir Nikolic
Novi Sad

Član broj: 38585
Poruke: 81
*.static.sbb.co.yu.

Profil

Re: kako koristiti getElementsBy za promenu styla?

^{28.11.2007. u 10:30 - pre 199 meseci}

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 :)

Odgovor na temu

vladimirn
Vladimir Nikolic
Novi Sad

Član broj: 38585
Poruke: 81
*.static.sbb.co.yu.

Profil

Re: kako koristiti getElementsBy za promenu styla?

^{28.11.2007. u 13:38 - pre 199 meseci}

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

Odgovor na temu