Selezione di radio button in sezioni differenti di una form

[Gianfranco]

Ciao,

premetto che sono un principiante in generale e in questo ambito
sono proprio a zero. Chiedo scusa ma ho un problema che non riesco a
risolvere da solo e provo a chiedere. :)

Ho bisogno di realizzare una form per una check list piuttosto
complessa suddivisa in piu' sezioni. Una cosa del tipo:

Sezione 01 (*)

Item 01-01 si no
Item 01-02 si no
Item 01-03 si no

Sezione 02 (*)
Item 02-01 si no
Item 02-02 si no

[...]

<INVIA>

Ogni sezione dovrebbe avere qualcosa che permetta di selezionare (e
magari deselezionare) tutti i radio button "si" della singola sezione ma
non delle altre, poi una volta compilata tutta la form si deve inviare
il tutto con un singolo submit.

In rete ho trovato diversi esempi che funzionano su tutta la form
(posso postarli se interessano) ma niente che faccia al caso mio.

Qualcuno sa darmi un aiuto o dirmi cosa cercare considerato che per me
la materia e' veramente ostica? Grazie.

Un saluto,

--
Gianfranco Bertozzi

[Roberto Tagliaferri]

ciao, la cosa più semplice è assegnare una classe ad ogni gruppo di
radio/check, classe che utilizzerai solo per identificare con jquery quello
specifico gruppo.

--
Roberto Tagliaferri-Linux user #30785 <-> r.tagliaferri@(forse)tosnet.it
www.robyt.eu

[Gianfranco]

On Sat, 10 Nov 2018 09:42:15 +0100, Roberto Tagliaferri wrote:

Ciao,

e grazie per la risposta. :-)

> ciao, la cosa più semplice è assegnare una classe ad ogni gruppo di
> radio/check, classe che utilizzerai solo per identificare con jquery quello
> specifico gruppo.

Immaginavo che si dovesse fare cosi', il problema e' che non
conoscendo nulla di JS sono costretto a scopiazzare e non son riuscito a
trovar nulla. Hai qualche link che possa aiutarmi?

Grazie,

--
Gianfranco Bertozzi

[Gianfranco]

On Sun, 11 Nov 2018 17:17:16 +0000 (UTC), Gianfranco wrote:

Ciao,

> Immaginavo che si dovesse fare cosi', il problema e' che non
> conoscendo nulla di JS sono costretto a scopiazzare e non son riuscito a
> trovar nulla. Hai qualche link che possa aiutarmi?

Vanno bene anche link a howto e simili purche' non troppo complessi.
Vista la mia ormai dimostrata incapacita' a comprendere i paradigmi
della OOP, sinceramente non vorrei mettermi a studiare un linguaggio
come JS che so gia' che non mi entrerebbe in testa. :')

Grazie ancora,


--
Gianfranco Bertozzi

[Alessandro Pellizzari]

On 11/11/2018 18:16, Gianfranco wrote:

> Vanno bene anche link a howto e simili purche' non troppo complessi.
> Vista la mia ormai dimostrata incapacita' a comprendere i paradigmi
> della OOP, sinceramente non vorrei mettermi a studiare un linguaggio
> come JS che so gia' che non mi entrerebbe in testa. :')

Non ti serve capire OOP, anche se comunque se vuoi usare un linguaggio
di programmazione è bene conoscerlo.

Devi capire il DOM, però, altrimenti in js non combinerai niente.

Usa jQuery. So che ti diranno che è vecchio, che ora si usa react, che
blablabla, ...

<div class="gruppoDaAttivare">
<button class="attivaTutti">Tutti</button>
<input type="radio" name="r1" value="1" class="si" />Si
<input type="radio" name="r1" value="0" class="no" />No

<input type="radio" name="r2" value="yep" class="si" />Certo
<input type="radio" name="r2" value="nope" class="no" />Scordatelo
</div>

<script>
$('button.attivaTutti').on('click', function() {
$('.gruppoDaAttivare input[type=radio].si').attr('checked', true);
});
</script>

o qualcosa del genere (non lo uso da un po').

Si può fare più figo trovando i sibling invece di andare sul div
contenitore, ma te lo lascio come esercizio per casa.

Bye.

[Gianfranco]

On Mon, 12 Nov 2018 12:48:45 +0000, Alessandro Pellizzari wrote:

Ciao,


e tante grazie anche a te. :-)

> Non ti serve capire OOP, anche se comunque se vuoi usare un linguaggio
> di programmazione è bene conoscerlo.
>
> Devi capire il DOM, però, altrimenti in js non combinerai niente.

Ci ho provato a lungo a capire gli oggetti e tutto quanto ruota loro
intorno: ho chiesto, comprato diversi testi, provato un po' di tutto ma
come vedo codice come quello che hai postato tu, con tutti quei puntini
sparsi in mezzo alle lettere, mi si chiude i cervello. :-o

> Usa jQuery. So che ti diranno che è vecchio, che ora si usa react,
> che blablabla, ...

Per le mie necessita' jquery credo sia piu' che sufficiente. C'e'
anche da dire che per me e' un divertimento, per questo cercavo un
esempio da imitare (scopiazzare)... mettermi a studiare JS, con tutte le
difficolta' che avrei, non e' proprio il caso. :-/

><div class="gruppoDaAttivare">
> <button class="attivaTutti">Tutti</button>
> <input type="radio" name="r1" value="1" class="si" />Si
> <input type="radio" name="r1" value="0" class="no" />No
>
> <input type="radio" name="r2" value="yep" class="si" />Certo
> <input type="radio" name="r2" value="nope" class="no" />Scordatelo
></div>
>
><script>
> $('button.attivaTutti').on('click', function() {
> $('.gruppoDaAttivare input[type=radio].si').attr('checked', true);
> });
></script>

Grazie dell'esempio e dell'esercizio; ho provato a fare un grezzo
copia e incolla e non sembra funzionare ma domani ho tempo per
dedicarmici e vedro' di compicciare qualche cosa. Se non riesco, torno a
rompere gli zebedei a voi. ;-)

Grazie ancora per l'aiuto,

--
Gianfranco Bertozzi

[Gianfranco]

On Mon, 12 Nov 2018 14:43:39 +0000 (UTC), Gianfranco wrote:

Ciao,

> Grazie dell'esempio e dell'esercizio; ho provato a fare un grezzo
> copia e incolla e non sembra funzionare ma domani ho tempo per

Non funziona perche' son bischero. Mancava jquery. :-)

Domani vedo se riesco a compicciar qualcosa, sarebbe carino anche
poter deselezionare in caso di ulteriore pressione sul bottone. :-)

[Alessandro Pellizzari]

On 12/11/2018 14:43, Gianfranco wrote:

>> $('button.attivaTutti').on('click', function() {
>> $('.gruppoDaAttivare input[type=radio].si').attr('checked', true);
>> });
>> </script>
>
> Grazie dell'esempio e dell'esercizio;

Non è difficile da capire. Traducilo in inglese e pensa a "$" come
"find" e a "." come "then". Dentro le virgolette di jQuery pensa in CSS:
i punti sono class, gli # sono id, le parentesi quadre sono ricerca
negli attributi

Tradotto in inglese:

Find the button attivaTutti, then, on click, do this:

Find anything with class gruppoDaAttivare and inside it find all the
inputs of type radio with a class "si", then set the attribute "checked"
to "true"

Dovrebbe essere abbastanza comprensibile anche se conosci poco l'inglese.

Bye.

[Gianfranco]

On Tue, 13 Nov 2018 10:30:29 +0000, Alessandro Pellizzari wrote:

Ciao,

> Non è difficile da capire. Traducilo in inglese e pensa a "$" come
> "find" e a "." come "then". Dentro le virgolette di jQuery pensa in CSS:
> i punti sono class, gli # sono id, le parentesi quadre sono ricerca
> negli attributi

Detta cosi' e' piu' facile, anche e' un modo di ragionare che non mi
piace molto... l'inglese lo so abbastanza, e' che non pensavo che quel
codice andasse interpretato in questo modo! :-D

Sto lavorandoci: se lascio il <div> sembra funzionare, se pero'
inserisco una <form>, cliccando sul "tuo" bottone mi invia i dati, cosa
che non dovrebbe fare per le mie necessita'.

Ho anche provato, per imparare, a modificare la riga:

$('.gruppoDaAttivare input[type=radio].si').prop('checked', true);

per vedere se mi riusciva far selezionare i "no" ma non sono riuscito.
('checked', false) e ('unchecked', true) non vanno. Dove sbaglio? :-o

Piu' tardi provo a fare piu' sezioni, cosi' vedo se funziona.

Grazie per la pazienza, sei molto gentile.

[Gianfranco]

On Tue, 13 Nov 2018 12:08:20 +0000 (UTC), Gianfranco wrote:

Ciao,

> $('.gruppoDaAttivare input[type=radio].si').prop('checked', true);
>
> per vedere se mi riusciva far selezionare i "no" ma non sono riuscito.

Devo pensare prima di scrivere, questa era facile:

$('.gruppoDaAttivare input[type=radio].no').prop('checked', true);

[Gianfranco]

On Tue, 13 Nov 2018 14:33:43 +0000 (UTC), Gianfranco wrote:

Ciao,

forse ci sono.

<form>
<div class="Selez01" action="potta.php">
Tutti
<input type="radio" class="SeleAll01" name="AllCheck" onclick="SeleSi('Selez01')";>Si</button>
<input type="radio" class="SeleAll01" name="AllCheck" onclick="SeleNo('Selez01')";>No</button><br />

Item 01
<input type="radio" name="01-01" value="1" class="si" />Si
<input type="radio" name="01-01" value="0" class="no" />No<br />

Item02
<input type="radio" name="01-02" value="1" class="si" />Si
<input type="radio" name="01-02" value="0" class="no" />No<br />
</div>

<div class="Selez02" action="potta.php">
Tutti
<input type="radio" class="SeleAll02" name="AllCheck" onclick="SeleSi('Selez02')";>Si</button>
<input type="radio" class="SeleAll02" name="AllCheck" onclick="SeleNo('Selez02')";>No</button><br />

Item 01
<input type="radio" name="02-01" value="1" class="si" />Si
<input type="radio" name="02-01" value="0" class="no" />No<br />

Item02
<input type="radio" name="02-02" value="1" class="si" />Si
<input type="radio" name="02-02" value="0" class="no" />No<br />
</div>

<input type="reset" />
<input type="submit" />
</form>

<script>
function SeleSi(Classe)
{
AllYes = '.' + Classe + ' input[type=radio].si';
$(AllYes).prop('checked', true);
}

function SeleNo(Classe)
{
AllNo = '.' + Classe + ' input[type=radio].no';
$(AllNo).prop('checked', true);
}
</script>

A me sembra che vada. Non e' bello, ho anche provato a far tutto
in una sola funzione (if prop('checked')==true) ma ho deciso di
contentarmi. Per le mie esigenze va bene anche cosi'.

Che ne pensi? Ti devo una birra. Da litro. :-)

Grazie ancora di tutto! :-)

--
Gianfranco Bertozzi

[Alessandro Pellizzari]

On 13/11/2018 16:04, Gianfranco wrote:
> <form>
> <div class="Selez01" action="potta.php">

L'action va nel form. ;)

> Tutti
> <input type="radio" class="SeleAll01" name="AllCheck" onclick="SeleSi('Selez01')";>Si</button>
> <input type="radio" class="SeleAll01" name="AllCheck" onclick="SeleNo('Selez01')";>No</button><br />

> ...

> <script>
> function SeleSi(Classe)
> {
> AllYes = '.' + Classe + ' input[type=radio].si';
> $(AllYes).prop('checked', true);
> }
>
> function SeleNo(Classe)
> {
> AllNo = '.' + Classe + ' input[type=radio].no';
> $(AllNo).prop('checked', true);
> }
> </script>

> A me sembra che vada. Non e' bello, ho anche provato a far tutto
> in una sola funzione (if prop('checked')==true) ma ho deciso di
> contentarmi. Per le mie esigenze va bene anche cosi'.

Puoi fare tutto con una funzione singola:

function Sele(Classe, sino)
{
AllNo = '.' + Classe + ' input[type=radio].' + sino;
$(AllNo).prop('checked', true);
}

e la chiami con

Sele('Selez01', 'si')

Bye.

[Gianfranco]

On Wed, 14 Nov 2018 10:32:32 +0000, Alessandro Pellizzari wrote:

Ciao,

>> <div class="Selez01" action="potta.php">

> L'action va nel form. ;)

Gia'. Non ci avevo fatto caso. Probabilmente rimaneggiando il codice
m'e' rimasto li'. :-)

> Puoi fare tutto con una funzione singola:
>
> function Sele(Classe, sino)
> {
> AllNo = '.' + Classe + ' input[type=radio].' + sino;
> $(AllNo).prop('checked', true);
> }

Dovevo pensarci io, posso benissimo concatenare il 'si' o il 'no'
nella stringa e poi passarla completa a jquery. Oltre che essere
inesperto sono pure arrugginito. :-/

Grazie di tutto. Vorrei ricambiare ma visti gli argomenti di cui sono
competente forse non ti conviene. ;-)

Un saluto e grazie ancora,

--
Gianfranco Bertozzi

[Catarsi]

Gianfranco <gber...@gmail.com> wrote:

> <div class="Selez01" action="potta.php">

Livornese? :-)

--
mailto: y = i
------------------------------------------------------
http://www.catarsi.it
Vivo nel terrore di non essere frainteso (Oscar Wilde)

[Gianfranco]

On Thu, 15 Nov 2018 23:49:22 +0100, Catarsi wrote:

Ciao,

>> <div class="Selez01" action="potta.php">

> Livornese? :-)

M'e' scappata... :-D

Viareggino. Di quelli col sangue salmastroso. :-)