0

preciso pegar o value de todos os input radio (que estão checked) de minha pagina, tem em torno de 10 radio, o value é carregado diretamente do banco de dados, mas eles estão desativados porque o usuário não pode alterar o value, eles já vem checados, preciso passar o value destes checkbox desativados para o input hidden, pois como já devem saber, inputs desativados não tem os dados enviados para o php.

Segue codigo: https://jsfiddle.net/h3ept1r5/1/

<div class="form-group">
  <input type="hidden" name="a">
  <div class="radio">
    <label for="yes1">
      <input type="radio" name="a" id="yes1" checked> Yes
    </label>
    <label for="no1">
      <input type="radio" name="a" id="no1"> No
    </label>
  </div>
</div>
<div class="form-group">
  <input type="hidden" name="b">
  <div class="radio">
    <label for="yes2">
      <input type="radio" name="b" id="yes2"> Yes
    </label>
    <label for="no2">
      <input type="radio" name="b" id="no2" checked> No
    </label>
  </div>
</div>
<div class="form-group">
  <input type="hidden" name="c">
  <div class="radio">
    <label for="yes3">
      <input type="radio" name="c" id="yes3" checked> Yes
    </label>
    <label for="no3">
      <input type="radio" name="c" id="no3"> No
    </label>
  </div>
</div>
<button class="btn btn-default">Submit</button>
1
  • 1
    Se eles já vem do servidor, ou seja, o servidor já "sabe" quais estão selecionados, não entendi o motivo de pegar de volta os valores.
    – Bacco
    17/03/2016 às 12:55

2 Respostas 2

3

No lugar de utilizar a propriedade disabled, faça o evento onclick retorna false, assim a ação normal não será executada e o utilizador não irá conseguir desmarcar a opção.

Com essa solução, o seu campo será enviado no corpo da mensagem da requisição.

<input type="radio" checked onclick="return false;" onkeydown="return false;"/>

Poderá haver um problema, como a opção não fica desativada e apenas impede que o utilizador faça o click, você pode adicionar a propriedade disabled somente nas opções que estão desmarcadas:

<input type="radio" checked onclick="return false;" onkeydown="return false;"/> Sim
<input type="radio" disabled onclick="return false;" onkeydown="return false;"/> Não

Veja em funcionamento: https://jsfiddle.net/h3ept1r5/3/

Outra opção é utilizar CSS e estilizar o input.

Você pode ver nesse tópico porque a solução acima funciona: Por que "return false;" , em um evento de clique, cancela a abertura do link?, embora a pergunta retrate um link, a explicação serve também para um radio button.

6
  • Estive pensando em responder desta forma, mas a questão da experiencia do usuario seria prejudicada, uma vez que a aparência do radio estaria como habilitada, dando a intenção que há possibilidade de mudança do comportamento, teria alguma sugestão para esta questão ? 17/03/2016 às 12:34
  • pensei nisso também
    – Leandro
    17/03/2016 às 12:35
  • @Leandro com CSS você pode alterar a aparência e simular um disabled. 17/03/2016 às 12:36
  • @GabrielRodrigues com CSS é possível. 17/03/2016 às 12:36
  • @Leandro você pode colocar a propriedade disabled somente na opção que está desmarcada, assim o utilizador saberá que não pode seleciona-la e a opção ativa estará bem a vista. Veja: jsfiddle.net/h3ept1r5/3 17/03/2016 às 12:45
1

Você pode fazer um each no seu input radio percorrendo e transferindo os valores para o input hidden.

Utilizei o parent() e o sibligns para localizar o hidden e inserir o valor.

Exemplo:

$('input[type=radio]').attr('disabled', true);
$('input[type=radio]:checked').each(function() {
   $(this).parent().parent().siblings('input[type=hidden]').val(this.value);
});

Veja funcionando no jsfiddle

Ou como sugerido pelo Filipe, adicionar um css simulando o disabled e dar um return false.

Exemplo:

$('input[type=radio]').css('opacity', '0.5');
$('input[type=radio]').on('click , keydown', function() {
  return false;
});

Veja funcionando no jsfiddle

3
  • estranho o primeiro exemplo nao funcionou para mim...
    – Leandro
    17/03/2016 às 13:11
  • tem que considerar que ele pegue o value somente dos radio que estão checados
    – Leandro
    17/03/2016 às 13:20
  • @Leandro provavelmente isto ocorreu por que você quer pegar o valor de um input, e os teus inputs não possuem valores, veja este exemplo: jsfiddle.net/filadown/nqxv9hsa/2 17/03/2016 às 13:20

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .