Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Campo Obrigatório

Galera estou fazendo um questionário e queria saber como eu faço para o usuário obrigatoriamente ter que selecionar alguma resposta para avançar para a proxima pergunta, já tentei colocar o required nos inputs mas não funcionou, alguem sabe outra solução?

1 resposta
solução!

Oi Vitor, tudo bem?

Para tornar um campo obrigatório em um formulário, você pode utilizar a validação em JavaScript. Uma forma simples de fazer isso é verificar se pelo menos uma opção foi selecionada antes de permitir que o usuário avance para a próxima pergunta.

Você pode fazer isso adicionando um evento de validação ao formulário, que será acionado quando o usuário tentar enviar o formulário sem ter selecionado uma resposta. Dentro desse evento, você pode verificar se pelo menos uma opção foi selecionada e, se não, exibir uma mensagem de erro para o usuário.

Aqui está um exemplo de como fazer isso:

<form onsubmit="return validarFormulario()">
  <label>
    Opção 1
    <input type="radio" name="opcao" value="opcao1">
  </label>
  <label>
    Opção 2
    <input type="radio" name="opcao" value="opcao2">
  </label>
  <label>
    Opção 3
    <input type="radio" name="opcao" value="opcao3">
  </label>
  <button type="submit">Avançar</button>
</form>

<script>
  function validarFormulario() {
    var opcoes = document.getElementsByName('opcao');
    var selecionado = false;
    for (var i = 0; i < opcoes.length; i++) {
      if (opcoes[i].checked) {
        selecionado = true;
        break;
      }
    }
    if (!selecionado) {
      alert('Por favor, selecione uma opção.');
      return false;
    }
    return true;
  }
</script>

Nesse exemplo, o evento onsubmit é adicionado ao formulário e chama a função validarFormulario(). Essa função percorre todos os campos do tipo radio com o mesmo nome (no caso, opcao) e verifica se pelo menos um deles foi selecionado. Se não, exibe uma mensagem de erro e retorna false, impedindo o envio do formulário. Se sim, retorna true e permite que o formulário seja enviado.

Você pode ver o exemplo aqui.

Espero ter ajudado.

Um abraço e bons estudos.