2

Tenho vários campos input de checkbox referente aos interesses do cliente para ele marcar (Interesse 1, 2, 3, ...), e outro com opção de Todos.

Eu quero que ele seja obrigado a marcar um destes campos,

Se eu coloco required em um campo específico, eu obrigo ele a marcar um campo que seria opcional.

Então não posso colocar required em nenhum input.

Nesse caso o formulário esta passando no submit sem ele marcar nenhum, eu queria obrigar ele pelo menos a marcar algum.

Se eu coloco radio, o problema é que ele só poderá escolher uma opção, mas são varias que pode escolher.

Teria alguma solução de resolver isto sem o uso de Javascript, somente com o HTML5 como por exemplo o required ?

2 Respostas 2

6

Acho que só com HTML isso não é possível. Ou seja, como explicaste na pergunta, não dá para usar o required porque vai forçar a checkar inputs que não são obrigatórios.

Tens mesmo de usar JavaScript.

Sugestão:

HTML

<input type="checkbox" />
<input type="checkbox" />
<input type="checkbox" />
<input type="checkbox" />
<button type="button">Testar</button>

JavaScript

var inputs = document.querySelectorAll('input');

function verificar() {
    return [].filter.call(inputs, function (input) {
        return input.checked;
    }).length;
}
document.querySelector('button').addEventListener('click', function () {
    var valido = verificar();
    if (!valido) alert('Falta escolher uma checkbox!');
    else alert('Tudo ok!');
});

jsFiddle: http://jsfiddle.net/puLhypmd/

2
  • Obrigado! Vou fazer como falou.
    – Obama
    Commented 20/07/2015 às 22:22
  • @AndréSilveiraMachado fico contente de ter ajudado. Acho a pergunta boa e seria bem interessante haver required para fieldset ou group mas acho que ainda vai demorar.
    – Sergio
    Commented 20/07/2015 às 22:26
0

O Java Script é uma opção para fazer esta validação no Front-end, se estiver utilizando alguma linguagem de programação como Php poderia também fazer a validação pelo Back-end. Só com o HTML a única opção seria você colocando o atributo checked. Exemplo:

<input type="checkbox" name="development" value="development"checked> Development<br>
<input type="checkbox" name="database" value="database"> Database<br>
<input type="checkbox" name="network" value="network"> Network<br>

O atributo checked utilizado em um input, define este input como selecionado por padrão. Assim esta opção seria selecionada por padrão no seu formulário e ao capturar o valor deste input iria ser recebido o value desse input, que no exemplo acima é 'development'. Os outros campos viriam como null por padrão no exemplo ou se o usuário selecionar eles (ou seja marcar eles, o input receber o 'checked'), virão capturar as informações também. Espero ter ajudado.

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 .