Labels

Tuesday, July 9, 2013

Como pegar o valor do 'radio' selecionado com javascript?

Pegue todos elementos "radio" com o mesmo "name" e ache o que está selecionado e retorne o valor.
Código:
<script>

 function mostrarGenero(){
  alert('O valor selecionado é '+ getRadioValor('genero'));
 }
 
 function getRadioValor(name){
  var rads = document.getElementsByName(name);
  
  for(var i = 0; i < rads.length; i++){
   if(rads[i].checked){
    return rads[i].value;
   }
  
  }
  
  return null;
 }

</script>

<input id='Masculino' type='radio' name='genero' value='Masculino' /><label for='Masculino'>Masculino</label>
<input id='Feminino' type='radio' name='genero' value='Feminino' /><label for='Feminino'>Feminino</label>

<br/>
<br/>

<button onclick='mostrarGenero()'> Mostra valor </button>

15 comments:

  1. Simples e Prático! Me Ajudou Muito ! Forte Abraço.

    ReplyDelete
  2. Sugiro utilizar jQuery.
    Se torna mais simples e fácil.


    EX:
    input type="radio" id="sim" value="S" > Sim
    input type="radio" id="nao" value="N" checked > Não

    button onclick='radiomarcado();'> Mostra valor /button

    script>

    function radiomarcado(){
    var marcado = $("#nao").is(":checked");
    if(marcado){
    marcado = "N";
    }else{
    marcado = "S";
    }
    alert(marcado);
    }

    /script

    ReplyDelete
    Replies
    1. Bom dia Felipe Costa, tudo bem?
      A ideia desse post era mostrar como pegar o valor usando apenas javascript puro. Mas toda dica é bem vinda, muito obrigado.
      Abraço.

      Delete
  3. Uma dica com jQuery:

    var var_name = $("input[name='radio_name']:checked").val();

    Problema resolvido com 1 linha!

    ReplyDelete
    Replies
    1. Excelente Granadeiro!!!
      Muito obrigado pela dica.
      Abraço.

      Delete
    2. Excelente dica.
      Simples e rápida.
      Perfeita!

      Delete
    3. Muito obrigada, resolveu meu problema!

      Delete
  4. Como eu faço para colocar em uma caixa de input? Por exemplo em um campo de texto?

    ReplyDelete