2012-02-09 2 views
5

avere questo pulsanti di opzione a controllo alimentati orizzontale:jQuery Mobile - Stato Cambiamento RadioButton programmazione

<div data-role="fieldcontain"> 
<fieldset data-role="controlgroup" data-type="horizontal"> 
    <legend>Geslacht:</legend> 
    <input id="gender-male" name="gender" type="radio" value="MALE" /> 
    <label for="gender-male">Man</label> 
    <input id="gender-female" name="gender" type="radio" value="FEMALE" /> 
    <label for="gender-female">Vrouw</label> 
</fieldset> 
</div> 

Ad un certo punto che voglio ripristinare i valori di programmazione utilizzando:

$('#gender-male').prop('checked', false) 
$('#gender-female').prop('checked', false) 

Tuttavia lo stile della i pulsanti radio non sono cambiati.

E.g. è stato selezionato MASCHILE sembra ancora selezionato.

Devo fare qualche tipo di aggiornamento?

risposta

17

Guardate questa:

$('#gender-male').attr("checked",false).checkboxradio("refresh"); 
+3

Sto avendo un problema simile. Quando provo questa soluzione, ottengo il seguente errore: Errore non rilevato: impossibile chiamare i metodi sul pulsante prima dell'inizializzazione; tentato di chiamare il metodo 'refresh'. Qualche idea su cosa sta causando questo? Non sto inizializzando i controlli correttamente? – Blake

0

Per la JqueryMobile 1.4 la soluzione di lavoro (testato) è questo:

(html tratto da jQm 1.4 codice demo)

<form><fieldset data-role="controlgroup"> 
    <input type="radio" name="radio-choice-v-2" id="radio-choice-v-2a" value="on" checked="checked"> 
    <label for="radio-choice-v-2a" style="font-weight: 100;">radio button A</label> 
    <input type="radio" name="radio-choice-v-2" id="radio-choice-v-2b" value="off"> 
    <label for="radio-choice-v-2b" style="font-weight: 100;">radio button B</label> 
    </fieldset></form> 

Come sopra il pulsante radio A è selezionato. Si desidera impostare il pulsante di opzione B selezionato e A impostato su deselezionato. Nota: checkboxradio ("refresh") va per ogni pulsante di opzione.

Javascript/Jquery (tratto da jQm 1.4 documentazione delle API e riadattato)

if (radioSetting == 0) { 

     $("#radio-choice-v-2b").prop("checked", false).checkboxradio("refresh"); 
     $("#radio-choice-v-2a").prop("checked", true).checkboxradio("refresh"); 
    } 
    else { 
     $("#radio-choice-v-2a").prop("checked", false).checkboxradio("refresh"); 
     $("#radio-choice-v-2b").prop("checked", true).checkboxradio("refresh"); 
    }