|
Mozda te nisam skroz razumeo, nemam ni pojma sta je HFSt, ali mislim da sam video par problemcica u kodu.
Ne bih rekao da select podrzava onload atribut. Ja bih to stavio u body.
Razliciti elementi moraju da imaju razlicite id-ove (jedan id <=> jedan element).
Ako hoces da elemente grupises u neke grupe onda koristis klase.
<select id="lista" name="metodologija" onchange="change(this)">
<option class="b" value="0" selected disabled >Izaberi tip dokumenta</option>
<option class="b" value="1" >B-S</option>
...
</select>
Da bi radio sa elementima iz neke klase/grupe moras da
im pristupis pomocu funkcije getElementsByClassName("klasa").
var b=document.getElementsByClassName("b");
var l=document.getElementsByClassName("l");
var o=document.getElementsByClassName("o");
var j=document.getElementsByClassName("j");
var n=document.getElementsByClassName("n");
var s=document.getElementsByClassName("s");
Navedena funkcija vraca niz od svih elemenata iz klase pa ako zelis da
izmenis bas sve elemente iz klase onda bi trebalo da koristis petlju.
function sakrij_b() {
var i;
for (i = 0; i < l.length; ++i)
l[i].hidden=false;
for (i = 0; i < o.length; ++i)
o[i].hidden=false;
for (i = 0; i < j.length; ++i)
j[i].hidden=false;
for (i = 0; i < n.length; ++i)
n[i].hidden=true;
for (i = 0; i < s.length; ++i)
s[i].hidden=true;
}
E sad, ne znam na koji nacin tacno filtriras ove podatke ali (mozda) ne moras
da pises svaki put kada hoces da sakrijes nesto drugo/trece/... novu funkciju vec sve moze izjedna da se uradi.
Ovaj kod radi u Firefox i Chrome ali ne radi u npr. Internet Explorer jer u njemu koliko vidim ne mozes da sakrijes option elemente. Zato je mozda bolji pristup npr. da ih stvarno brises iz select i dodajes po potrebi umesto sto ih sakrivas.
Napravio sam jedan demo cisto da ti da ideju kako bi otprilike ja to resio.
<body>
<select id="lista"></select><br> <!-- lista ce dakle da nam inicijalno bude prazna a po potrebi cemo dodavati stvari u nju -->
<label><input type="checkbox" class="polja" onchange="prikazi('b')" id="b"></label> b<br>
<label><input type="checkbox" class="polja" onchange="prikazi('l')" id="l"></label> l<br>
<label><input type="checkbox" class="polja" onchange="prikazi('o')" id="o"></label> o<br>
<label><input type="checkbox" class="polja" onchange="prikazi('j')" id="j"></label> j<br>
<label><input type="checkbox" class="polja" onchange="prikazi('n')" id="n"></label> n<br>
<label><input type="checkbox" class="polja" onchange="prikazi('s')" id="s"></label> s
</body>
<script>
/* kod za option elemente koje zelimo da koristimo u nasoj listi
cemo skladistiti kao obicne stringove (tj. kao obican tekst)
a po potrebi cemo taj kod/tekst samo dodavati u select element. */
var b =
'<option class="b" value="0" selected disabled >Izaberi tip dokumenta</option>' +
'<option class="b" value="1" >B-S</option>' +
'<option class="b" value="2" >B-B</option>' +
'<option class="b" value="3" >B-R</option>' +
'<option class="b" value="4" >B-J</option>';
var l =
'<option class="l" value="5" >L-S</option>' +
'<option class="l" value="6" >L-B</option>' +
'<option class="l" value="7" >L-R</option>' +
'<option class="l" value="8" >L-J</option>';
var o =
'<option class="o" value="9" >O-S</option>' +
'<option class="o" value="10" >O-B</option>' +
'<option class="o" value="11" >O-R</option>' +
'<option class="o" value="12" >O-J</option>';
var j =
'<option class="j" value="13" >J-S</option>' +
'<option class="j" value="14" >J-B</option>' +
'<option class="j" value="15" >J-R</option>' +
'<option class="j" value="16" >J-J</option>';
var n =
'<option class="n" value="17" >N-S</option>' +
'<option class="n" value="18" >N-B</option>' +
'<option class="n" value="19" >N-R</option>' +
'<option class="n" value="20" >N-J</option>';
var s =
'<option class="s" value="21" >S-S</option>' +
'<option class="s" value="22" >S-B</option>' +
'<option class="s" value="23" >S-R</option>' +
'<option class="s" value="24" >S-J</option>';
var lista = document.getElementById("lista");
var polja = document.getElementsByClassName("polja");
function prikazi(x) {
if (document.getElementById(x).checked === false) {
/* innerHTML vraca kod koji se nalazi unutar nekog elementa.
ako smo ovo polje na koje smo kliknuli decekirali obrisacemo
sav kod iz liste tako sto cemo staviti innerHTML na prazno ("")
a onda cemo dodati kod za elemente iz grupa koje su ostale cekirane */
lista.innerHTML = "";
var i;
for (i = 0; i < polja.length; ++i)
if (polja[i].checked) {
switch (polja[i].id) {
case "b": lista.innerHTML += b; break;
case "l": lista.innerHTML += l; break;
case "o": lista.innerHTML += o; break;
case "j": lista.innerHTML += j; break;
case "n": lista.innerHTML += n; break;
case "s": lista.innerHTML += s; break;
}
}
} else {
/* ako smo upravo cekirali ovo polje onda cemo
samo dodati kod za elemente iz date grupe */
switch (x) {
case "b": lista.innerHTML += b; break;
case "l": lista.innerHTML += l; break;
case "o": lista.innerHTML += o; break;
case "j": lista.innerHTML += j; break;
case "n": lista.innerHTML += n; break;
case "s": lista.innerHTML += s; break;
}
}
}
</script>
|
