Tengo mi selector de radio que se ve así
<div id="graph_selector" style="display:none; text-align: center;" > <p><b>Tipo de Grafico: </b></p> <div class="cc-selector"> <input id="axes" type="radio" name="sel_graph" class="radio_selector" value="axes" /> <label class="drinkcard-cc axes"for="axes"></label> <input id="activity" type="radio" name="sel_graph" class="radio_selector" value="activity" /> <label class="drinkcard-cc activity" for="activity"></label> <input id="pie" type="radio" name="sel_graph" class="radio_selector" value="pie" /> <label class="drinkcard-cc pie" for="pie"></label> </div> </div>
Un botón para enviar mi selección
<button type="submit" class="btn btn-success" id="guardar_grafico">Graficar</button>
Estoy tratando de obtener el valor correcto en mi js, pero cuando uso console.log(); todo lo que obtengo es el valor de la primera entrada = "ejes", independientemente de lo que elija
<script type="text/javascript"> $('#guardar_grafico').click(function() { var graph_selector = document.querySelector('input[name=sel_graph]').value console.log(graph_selector); });
Cualquier ayuda sería apreciada
Para obtener el valor de la radio seleccionada en un grupo de radio, debe buscar la propiedad checked
en cada radio.
En este ejemplo, recorre todas las radios con ese atributo name="sel_graph"
y filtra esa lista a la 1 radio que está marcada.
var graph_selector = Array.from( document.querySelectorAll('input[name=sel_graph]') ).filter(radio => radio.checked)[0]?.value; console.log(graph_selector);
Además, me acabo de dar cuenta de que estás usando jQuery. Hay una solución más simple con eso, verifique esta respuesta.
nvm, resolvió el problema, me faltaba la propiedad marcada en mi js
pasó de esto
var graph_selector = document.querySelector('input[name=sel_graph]').value
a esto
var graph_selector = document.querySelector('input[name=sel_graph]:checked').value