bloggers bloggers

Marco Napolitano
Messaggi: 68
Stelle: 0
Data: 15/11/17
Jader Jed Francia
Messaggi: 50
Stelle: 0
Data: 22/09/17
Ezio Lombardi
Messaggi: 9
Stelle: 0
Data: 23/06/17
Chiara Mambretti
Messaggi: 25
Stelle: 0
Data: 27/02/17
Serena Traversi
Messaggi: 3
Stelle: 0
Data: 21/07/16
Francesco Falanga
Messaggi: 8
Stelle: 0
Data: 14/06/16
Antonio Musarra
Messaggi: 2
Stelle: 0
Data: 18/11/13
Simone Celli Marchi
Messaggi: 6
Stelle: 0
Data: 09/07/13
marcello marangio
Messaggi: 4
Stelle: 0
Data: 05/07/13
Marco Mancini
Messaggi: 1
Stelle: 0
Data: 05/06/13
Indietro

Selezionare un radio button con Alloy UI

Lavorare sugli elementi di un form (ma non solo) con Alloy UI è abbastanza semplice; tuttavia possono esserci casi in cui non sia effettivamente così semplice ed immediato.

Uno di questi casi è rappresentato dal recupero del valore selezionato in un radio button.Perchè?!

Il motivo è legato alla modalità con cui normalmente si recupera la reference di un elemento del DOM con Alloy UI, ossia per id:

A.one('#<portlet: namespace />element_id');

Supponiamo quindi di avere definito un radio group nel modo seguente:

<aui:input label="choice-1" name="myRadio" type="radio" value="1" />

<aui:input label="choice-2" name="myRadio" type="radio" value="2" />

<aui:input label="choice-3" name="myRadio" type="radio" value="3" />

La cosa da notare è che l'attributo name è (e deve essere) uguale per tutti gli elementi, mentre l'attributo id non è presente; ciò significa che la taglib creerà un id univoco random per ogni elementi e quindi non sappiamo a priori che valore avrà.

Ovviamete se definissimo un idesplicito per ogni elemento il problema non ci sarebbe ed io avrei finito di scrivere questo post...

Se invece siete nel caso sopra citato, basta lavorare con un pò di selettori CSS per recuperare la reference all'elemento selezionato. Come?! Così:

var element =

A.one("input[name=<portlet:namespace/>myRadio]:checked");

In realtà sarebbe sempre meglio fare riferimento ad un elemento contenitore come ad esempio il form di appartenenza:

var element =

A.one("#<portlet:namespace/>fm input[name=<portlet:namespace/>myRadio]:checked");

Fate solo attenzione ad una cosa: se nessuno dei radio button è selezionato, la funzione A.one restituisce null quindi occhio ad utilizzare il suo valore di ritorno.

Precedente
Commenti
Nessun commento. Vuoi essere il primo.