2012-08-31 10 views
10

Sto lavorando con un modulo con un pulsante di opzione che fa parte di un set di radio e solo uno può essere selezionato per volta (nessun problema con la selezione singola). Una di queste radio deve attivare un codice ogni volta che viene selezionato un codice diverso quando non è selezionato (un'altra radio è selezionata), usando il metodo .change e attiva il codice quando si fa clic, ma non quando perde la selezione. Quello che voglio è passare o essere in grado di sapere quando perde la selezione.jQuery group of radio buttons .change method

Potrei farlo aggiungendo il codice alle altre radio .change metodo ma ci sono molti set di radio e sarebbe doloroso, sto cercando una configurazione di una volta.

Modifica

Il markup è fatto di motore ASP MVC Razor in questo modo:

@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'); 
    }); 
}); 

Il cambiamento stringa unica appare quando si clicca il 'speciale -radio 'radio.

+1

Condividere po 'di codice. Il metodo di cambio – Gabe

risposta

4

È possibile farlo utilizzando evento di modifica sul gruppo di pulsanti in questo modo,

assegno a questa domanda,

Monitoring when a radio button is unchecked

+0

non funziona con lui perché, lui/lei sta applicando sul singolo pulsante di opzione invece che sul gruppo. –

3

Non v'è alcun evento scatta quando una radio non è selezionata, perché sarebbe ridondante. Prova a modificare:

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

Si mette un evento di modifica sul set di radio e solo spara un evento se la radio selezionata è speciale e un altro evento altrimenti.

+0

Non si adatta perfettamente al mio problema perché ho diversi gruppi di radio, ma è un buon punto di partenza. – loki

+0

Puoi usare '$ ('input [nome = pippo]')' se vuoi individuare un set. –

2

Se non è possibile aggiungere una classe. È possibile utilizzare un contenitore con identificatore per questi pulsanti di opzione. In questo modo puoi isolare l'evento di modifica. 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> 
​