[Javascript] Lavorare sulle checkbox

[Edde]

Ciao



Allora, ho una form con una serie di checkbox.



Queste checkbox sono legate a variabili che fanno parte di un albero, ed io vorrei che se cliccassi su una mi si cliccassero automaticamente anche tutte quelle legate ai "figli".



In soldoni, ogni checkbox ha un nome del tipo (dove i nomi che vedete corrispondono alle etichette dei nodi dell'albero... Quindi Pippo_Topolino e Pippo_Topolino_Pluto si trovano sullo stesso ramo, ma la seconda ha un nodo in più):



1) Pippo_Topolino

2) Pippo_Topolino_Pluto

3) Pippo_Topolino_Pluto_Paperino



Se clicco sulla seconda, si deve cliccare anche la terza (Paperino è un figlio di Pluto)

Se clicco sulla prima si devono cliccare anche le altre due (Pluto è un figlio di Topolino, e Paperino è un figlio di Pluto)



Spero di non essere stato troppo contorto...



Mi sto spulciando la guida su html.it , ma se nel frattempo qualcuno riesce a darmi delle dritte (sono assolutamente a zero di javascript, ma conosco il java) glie ne sarei molto grato



"Ci sono tante cose da fare, e così poco tempo...."

[dierre]

fai un evento onClick che richiama una funzione che si preoccupa di checkare anche gli altri.

[andbin]

Prova questa pagina e dimmi se è quello che volevi:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Prova selezione checkbox</title>
<script type="text/javascript">
<!--
function click_chkbox (chk)
{
    var len = chk.name.length;

    var elements = document.form1.elements;

    for (var i = 0; i < elements.length; i++)
    {
        if (elements[i].name.substr (0, len) == chk.name)
            elements[i].checked = chk.checked;
    }
}
//-->
</script>
</head>
<body>

<form name="form1">
<input type="checkbox" onclick="click_chkbox(this)" name="uno">Checkbox 1
<br>
<input type="checkbox" onclick="click_chkbox(this)" name="uno_due">Checkbox 2
<br>
<input type="checkbox" onclick="click_chkbox(this)" name="uno_due_tre">Checkbox 3
<br>
<input type="checkbox" onclick="click_chkbox(this)" name="uno_due_tre_quattro">Checkbox 4
<br>
</form>

</body>
</html>

[Edde]

Originariamente inviato da andbin

Prova questa pagina e dimmi se è quello che volevi:

Nella guida sono arrivato agli eventi, e ad occhio mi sembra quello che mi serve. Però non mi funziona...

[andbin]

Originariamente inviato da Edde

Però non mi funziona...

Cioè??? Cosa fa? Hai provato esattamente il mio codice? (che, preciso, l'ho testato su FF/IE/Opera)

[Edde]

Originariamente inviato da andbin

Cioè??? Cosa fa? Hai provato esattamente il mio codice? (che, preciso, l'ho testato su FF/IE/Opera)

Improvvisamente ha cominciato a funzionare...

Non chiedermi il perchè... non ne ho la più pallida idea....

Lo avevo provato su ie e firefox, e non andava da nessuna delle due parti

E' quasi quello che mi serve (ma non è colpa tua, sono stato io poco chiato).

In realtà è possibile avere due checkbox:

Pippo_Topolino_Pluto
Pippo_Topolino_Pluto1

Con il tuo codice se clicco la prima clicca pure la seconda, ma in realtà Pluto e Pluto1 sono nodi diversi, quindi non lo dovrebbe fare.

Ora vedo se riesco a modificare il codice, intanto grazie

[andbin]

Originariamente inviato da Edde

In realtà è possibile avere due checkbox:

Pippo_Topolino_Pluto
Pippo_Topolino_Pluto1

Con il tuo codice se clicco la prima clicca pure la seconda, ma in realtà Pluto e Pluto1 sono nodi diversi, quindi non lo dovrebbe fare.

Quindi, se ho capito bene, la regola è che se i due nomi hanno la stessa iniziale e differiscono solo per un numero alla fine, allora NON sono correlati. Giusto?

Prova con questa funzione:

function click_chkbox (chk)
{
    var len = chk.name.length;

    var elements = document.form1.elements;

    var regex = new RegExp ("^\\d+$");

    for (var i = 0; i < elements.length; i++)
    {
        var elem_name = elements[i].name;

        if (elem_name.substr (0, len) == chk.name && !regex.test (elem_name.substr (len)))
            elements[i].checked = chk.checked;
    }
}

[Edde]

Non capisco... ho inserito il tuo codice in una jsp e mi da l'errore di prima...

Ti posto la pagina che ne viene fuori:

http://otakar.altervista.org/Varie/E...Properties.htm

[andbin]

Originariamente inviato da Edde

Non capisco... ho inserito il tuo codice in una jsp e mi da l'errore di prima...

Beh, ovvio, io nella mia pagina ho dato il nome 'form1' al <form> mentre nella tua pagina il form non ha nome.

Hai messo: <form action="Start" method="POST" >

Comunque prova il codice che ho postato appena prima ... dovrebbe risolvere la questione del numero finale.

[Edde]

Originariamente inviato da andbin

Quindi, se ho capito bene, la regola è che se i due nomi hanno la stessa iniziale e differiscono solo per un numero alla fine, allora NON sono correlati. Giusto?

Il secondo codice che mi hai mandato non va: infatti avendo le 4 ceckbox:

"uno"
"uno_due"
"uno_due_tre"
"uno_due_tre1"
"uno_due_tre_quattro"

Cliccando sulla prima non mi clicca la terza (mentre in realtà dovrebbe farlo).

Ho risolto così:

function click_chkbox (chk)
     {
      varr len = chk.name.length;
      var elements = document.form1.elements;

      for (var i = 0; i < elements.length; i++)
          {
	if (elements[i].name.substr (0, len+1) == chk.name+"_")
	     elements[i].checked = chk.checked;
	}
}

Resta il problema sulla servlet

[Edde]

Originariamente inviato da andbin

Beh, ovvio, io nella mia pagina ho dato il nome 'form1' al <form> mentre nella tua pagina il form non ha nome.

Hai messo: <form action="Start" method="POST" >

Comunque prova il codice che ho postato appena prima ... dovrebbe risolvere la questione del numero finale.

Sono un cojonazzo... ora provo

[Edde]

C'era anche un altro errore (colpa mia).

Ti voglio bene

Grazie ancora