2012-08-31 27 views
10

Estoy trabajando con un formulario con un botón de opción que forma parte de un conjunto de radios y solo se puede seleccionar uno a la vez (no hay problema con la selección individual). Una de esas radios debe disparar un código cada vez que se selecciona un código diferente cuando se deselecciona (se selecciona otra radio), usando el método .change y dispara el código al hacer clic en él, pero no cuando pierde la selección. Lo que quiero es alternar o saber cuándo pierde la selección.jQuery grupo de botones de radio. Método de cambio

Podría hacerlo agregando el código al otro método de radios .change pero hay muchos conjuntos de radios y sería doloroso, estoy buscando una configuración única.

Editar

El marcado se hace de motor ASP MVC Razor así:

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

El cambio de secuencia solamente aparece cuando se hace clic en el 'especial -radio 'radio.

+1

Compartir algo de código. – Gabe

Respuesta

4

Usted puede hacer esto mediante el uso de evento de cambio de grupo de radio de esta manera,

cheque esta pregunta,

Monitoring when a radio button is unchecked

+0

método de cambio no funciona con él porque, él/ella está aplicando un solo botón de radio en lugar de grupo. –

3

hay ningún evento desencadena cuando una radio está desactivada, porque sería redundante. Tal vez puedas probar:

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

Se pone un evento de cambio en el conjunto de radios y solo dispara un evento si el radio seleccionada es especial y otro caso contrario.

+0

No encaja perfectamente en mi problema porque tengo varios grupos de radios, pero es un buen punto de partida. – loki

+0

Puede usar '$ ('input [name = foo]')' si desea seleccionar un conjunto. –

2

Si no es posible agregar una clase para. Puede usar un contenedor con identificador para estos botones de opción. De esta forma puede aislar el evento de cambio. 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> 
​ 
Cuestiones relacionadas