Botón de radio jQuery set

134

Estoy tratando de configurar un botón de radio. Quiero configurarlo usando el valor o la identificación.

Esto es lo que he intentado.

$('input:radio[name=cols]'+" #"+newcol).attr('checked',true);

newcol es la identificación del botón de radio.

Tal vez una pequeña edición está en orden.

Hay dos conjuntos de cajas de radio, una con columnas y la otra con filas. Entonces veo el punto de no usar id's. Culpa mía. Entonces tengo como ejemplo:

<input type="radio" name="rows" class="listOfCols" 
   style="width: 50%; " value="Site"></input>

y

<input type="radio" name="cols" class="listOfCols" 
   style="width: 50%; "  value="Site"></input>

con la identificación eliminada, y necesito configurar la correcta.

jquery radio-button

— mike628
fuente

55

posible duplicado de cómo configurar la opción de radio marcada al cargar con jQuery

— Chris Pratt

196

Su selector busca el descendiente de un input:radio[name=cols]elemento que tiene la identificación de newcol(bueno, el valor de esa variable).

Intente esto en su lugar (ya que está seleccionando por ID de todos modos):

$('#' + newcol).prop('checked',true);

Aquí hay una demostración: http://jsfiddle.net/jasper/n8CdM/1/

Además, a partir de jQuery 1.6, el método preferido para alterar una propiedad es .prop(): http://api.jquery.com/prop

— Jaspe
fuente

55

1 para propvs attr. attren desuso por propiedades y ya no funciona en jQuery 2.0))

— gavenkoa

87

Encontré la respuesta aquí:
https://web.archive.org/web/20160421163524/http://vijayt.com/Post/Set-RadioButton-value-using-jQuery

Básicamente, si desea marcar un botón de radio, DEBE pasar el valor como una matriz:

$('input:radio[name=cols]').val(['Site']);
$('input:radio[name=rows]').val(['Site']);

— Chococroc
fuente

Hola, ese enlace no tiene contenido sugerido. ¿Por qué siguen rechazando mi edición para eliminar el enlace? No contiene nada al respecto.

— Menuka Ishan

@MenukaIshan, el punto es: dar crédito. El enlace está disponible en web.archive.org, y el tipo que lo escribió la primera vez y de quien tengo la idea de la respuesta tiene que recibir su crédito. No elimine el enlace, y si desea ver la publicación original, copie y pegue el enlace (no sé por qué va a la página anterior en lugar de la web.archive.org)

— Chococroc

2

@ Chococroc No ha configurado correctamente el Markdown de la pregunta. Vi la versión del archivo web y la vinculé correctamente. Después de la revisión, se vinculará correctamente al sitio.

— Menuka Ishan

2

Parece que esta debería ser la respuesta aceptada, ya que es la solución mencionada en los documentos de jQuery

— plong0

15

En su selector, parece que está intentando obtener algún elemento anidado de su botón de opción con una identificación determinada. Si desea marcar un botón de radio, debe seleccionar este botón de radio en el selector y no otra cosa:

$('input:radio[name="cols"]').attr('checked', 'checked');

Esto supone que tiene el siguiente botón de opción en su marcado:

<input type="radio" name="cols" value="1" />

Si su botón de radio tenía una identificación:

<input type="radio" name="cols" value="1" id="myradio" />

puedes usar directamente un selector de id:

$('#myradio').attr('checked', 'checked');

— Darin Dimitrov
fuente

Si hay varias radios con el colsnombre $('input:radio[name="cols"]').attr('checked', 'checked');, seleccionará solo la última. Ejecutará el código en cada uno, pero cada vez que establezca la checkedpropiedad, el elemento previamente establecido se desarmará. Aquí hay una demostración: jsfiddle.net/jasper/n8CdM/2

— Jasper

@Jasper, sí, es verdad. Es por eso que sugerí usar un selector de id.

— Darin Dimitrov

12

Puedes probar el siguiente código:

$("input[name=cols][value=" + value + "]").attr('checked', 'checked');

Esto establecerá el atributo marcado para las columnas de radio y el valor como se especifica.

— punita.gosar
fuente

1

...the most important concept to remember about the checked attribute is that it does not correspond to the checked property.

Fuente: api.jquery.com/attr

— Jasper

10

¿Por qué lo necesitas 'input:radio[name=cols]'? No conoce su html, pero suponiendo que los identificadores sean únicos, simplemente puede hacer esto.

$('#'+newcol).prop('checked', true);

— elclanrs
fuente

6

Prueba esto:

$("#" + newcol).attr("checked", "checked");

He tenido problemas con attr("checked", true), así que tiendo a usar lo anterior en su lugar.

Además, si tiene la identificación, entonces no necesita esas otras cosas para la selección. Una identificación es única.

— El oso de Awnry
fuente

1

prop es mejor que attr para cosas como esta

— RozzA

attr se ha ido en jQuery 1.9+ Use prop.

— Mike_Laird

Tienes razón, pero en última instancia depende de tu situación específica. Si su código siempre se ejecutará con jQuery 1.6+, entonces prop es el camino a seguir. Pero si su código puede estar ejecutándose en versiones anteriores, entonces la solución no es tan sencilla. Por ejemplo, mantengo el complemento jQuery PickList y admitimos jQuery 1.4+, por lo que simplemente usar prop no es una opción. Este es un boleto abierto, así que si tiene alguna sugerencia elegante, me encantaría escucharla; Simplemente no he tenido tiempo de hacer la investigación todavía.

— The Awnry Bear

El problema es que incluso si su solución puede ser más compatible con versiones anteriores, simplemente no funciona en este caso: seleccione A, obtendrá un nuevo checked="checked"atributo y el navegador lo mostrará como verificado, luego seleccione B y sucederá lo mismo. Ahora, cuando vuelva a seleccionar A, ya tendrá un checked="checked"atributo y nada cambiará. Como efecto secundario de ese B todavía se seleccionará, no A.

— Kyborek

2

Dado que newcoles la ID del botón de radio, simplemente puede usarlo como se muestra a continuación.

$("#"+newcol).attr('checked',true);

— Selvakumar Arumugam
fuente

2

El uso .filter()también funciona y es flexible para id, value, name:

$('input[name="cols"]').filter("[value='Site']").attr('checked', true);

(visto en este blog )

— dhc
fuente

1

Creo que esta es una respuesta igualmente válida, pero debería usar el método prop (): $ ('input [name = "cols"]'). Filter ("[value = 'Site']"). Prop ('marcado ', cierto);. El usuario desea establecer por "valor o id". Puede haber ocasiones en las que no desee establecer valores de identificación para cada opción de radio, por lo que es útil obtener por nombre y filtrar por valor.

— Zac Imboden

2

Combinando respuestas anteriores:

$('input[name="cols"]').filter("[value='Site']").click();

— Graham Laight
fuente

0

Simplemente puede usar:

$("input[name='cols']").click();

— Markoj
fuente

0

La respuesta elegida funciona en este caso.

Pero la pregunta era sobre encontrar el elemento basado en el grupo de radio y la identificación dinámica, y la respuesta también puede dejar el botón de radio que se muestra no afectado.

Esta línea selecciona exactamente lo que se solicitó al tiempo que muestra el cambio en la pantalla también.

$('input:radio[name=cols][id='+ newcol +']').click();

— yo_
fuente