2012-08-31 16 views
10

Pracuję z formularzem za pomocą przycisku radiowego, który jest częścią zestawu radiotelefonów i można wybrać tylko jeden z nich (nie ma problemu z pojedynczym wyborem). Jeden z tych radiotelefonów musi wystrzelić kod za każdym razem, gdy zostanie wybrany inny kod, gdy zostanie odznaczony (wybrano inne radio), przy użyciu metody .change i uruchamia kod po kliknięciu, ale nie po utracie zaznaczenia. To, czego chcę, to przełączać się lub być w stanie wiedzieć, kiedy traci wybór.jQuery grupa przycisków radiowych .change method

Mogę to zrobić dodając kod do innej metody radia .change, ale istnieje wiele zestawów radia i byłoby to bolesne, szukam konfiguracji jednorazowej.

Edit

Znacznik wykonany jest z silnikiem ASP MVC Razor tak:

@Html.RadioButtonFor(x => x.SomeModel, new { @class = "special-radio" }) 
@* Other radios but without the 'specia-radio' class *@ 

JS:

// logging 
$(function(){ 
    $('.special-radio').change(function(){ 
    console.log('change'); 
    }); 
}); 

Zmiana ciąg pojawia się tylko po kliknięciu „special radio "radia".

+1

Podziel się jakiś kod. – Gabe

Odpowiedz

4

Można to zrobić za pomocą zmiany wydarzenie w grupie radiowej w ten sposób,

check to pytanie,

Monitoring when a radio button is unchecked

+0

Metoda zmiany nie działa z nim, ponieważ stosuje się do pojedynczego przycisku radiowego zamiast do grupy. –

3

Nie ma zdarzenie wyzwalane, gdy radio jest zaznaczona, bo to byłoby zbędny. Spróbuj to zamiast:

http://jsfiddle.net/hmartiro/g4YqD/1/

Stawia zdarzenie zmiany na planie radia i tylko jedno zdarzenie pożary czy wybrany radio jest wyjątkowy i inny wydarzenie inaczej.

+0

To nie pasuje idealnie do mojego problemu, ponieważ mam wiele grup radiotelefonów, ale to dobry punkt wyjścia. – loki

+0

Możesz użyć '$ ('input [name = foo]')' jeśli chcesz wyodrębnić jeden zestaw. –

2

Jeśli dodanie klasy nie jest możliwe. Możesz użyć kontenera z identyfikatorem dla tych przycisków radiowych. W ten sposób możesz wyizolować wydarzenie zmiany. DEMO FIDDLE

var prev_data; 
$('#special_radios input').change(function(){ 
    var me = $(this); 
    //running function for check 
    $('#log').html('<p>firing event for check: '+ me.attr('id') +'</p>'); 
    if(prev_data) 
     uncheck_method(prev_data); 
    prev_data = me; 
}); 

//@param obj = jquery raidio object 
function uncheck_method(obj){ 
    $('#log').append('<p>firing event for uncheck: '+obj.attr('id')+'</p>'); 
    obj.prop('checked', false) 
    //console.log($('#special_radios input:checked')); 
} 

​ 

html

<input type="radio" name="zz" id="5"/> 
<div id="special_radios"> 
    <input type="radio" name="rx" id="1"/> 
    <input type="radio" name="ry" id="2" /> 
    <input type="radio" name="rz" id="3"/> 
    <input type="radio" name="ra" id="4"/> 
</div> 
<div id="log"></div> 
​ 
Powiązane problemy