2012-02-09 1 views
5

Mając to przyciski opcji w poziomym controlgroup:jQuery Mobile - zmiana stanu radiobutton programowo

<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> 

w danym punkcie Chcę zresetować wartości programowo przy użyciu:

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

Jednak stylizacja przyciski radiowe nie zostały zmienione.

E.g. jest wybrana opcja MALE, ale nadal jest wybrana.

Czy powinienem odświeżyć?

Odpowiedz

17

wygląd w tym:

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

Mam podobny problem. Kiedy próbuję tego rozwiązania, pojawia się następujący błąd - Uncaught Error: nie można wywołać metod na przycisku przed inicjalizacją; próbował wywołać metodę "odśwież". Jakieś pomysły na to, co to powoduje? Czy nie zainicjowałem poprawnie sterowania? – Blake

0

Dla JqueryMobile 1,4 roztwór roboczy (testowane) to:

(HTML pochodzi JQM 1,4 kod 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> 

Jw przycisk radiowy A jest zaznaczony. Chcesz ustawić przycisk radiowy B zaznaczony i A ustawić, aby odznaczyć. Uwaga: checkboxradio ("odśwież") dotyczy każdego przycisku opcji.

JavaScript/jQuery (zaczerpnięte z JQM 1,4 dokumentacja API i ponownie dostosowany)

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"); 
    }