Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

Html form required com 2 ou mais botões

Fala galera, beleza? Preciso de uma ajuda até que besta, mas não consigo solucionar rs.

Estou fazendo validações com formulários usando apenas o html (required). Ele funciona muito bem quando tenho apenas um botão (Enviar).

Mas na página que estou fazendo, estou com 3 inputs (enviar, cancelar, limpar). Qnd eu clico em enviar, ele surge a mensagem do required. Mas quando clico nos botões cancelar e limpar, eles também estão surgindo a mensagem do required.

Tem como deixar os required do html somente pro botão enviar?

4 respostas

Oi Bruno, tudo certo?

Consegue mandar seu código HTML aqui para eu te auxiliar melhor? Fico no aguardo, abraços!

                <div class="row">
                    <div class="form-group col-md-4">
                        <label class="form-label">CNH Obrigatória:</label>
                        <input type="text" class="form-control" id="vagaCNH" maxlength="5" placeholder="Ex: AB">
                    </div>
                    <div class="form-group col-md-4">
                        <label class="form-label">Data do Processo Seletivo: *</label>
                        <input type="text" class="form-control" id="vagaDataProcesso" maxlength="30" placeholder="Ex: 00/00/0000, as 15:00h" required>
                    </div>
                    <div class="form-group col-md-4">
                        <label class="form-label">Nome da Pessoa de Contato: *</label>
                        <input type="text" value="" class="form-control" id="vagaPessoaContato" maxlength="20" placeholder="Seu nome" required>
                    </div>
                </div>

                <div class="row justify-content-center d-grid">
                    <div class="form-group">
                        <input type="submit" value="Enviar" class="btnVaga" id="" onclick="">
                        <input type="submit" value="Cancelar" class="btnVaga" id="" onclick="">
                        <input type="submit" value="Limpar" class="btnVaga" id="" onclick="">
                    </div>
                </div>
solução!

Oi Bruno! Acontece que os seus três botões estão com o input do type="submit", fazendo com que quando há o clique de todos os botões, ele apareça o estado de required, pois 'submit' significa enviar dados.

Para arrumar isso, você precisa deixar o type="submit" apenas no botão de "Enviar". No botão de calcular e limpar, você pode tirar esse tipo e fazer a sua lógica desejada.

Espero ter ajudado, bons estudos =)

Nossa! Sabia que era algo tosco que eu não estava prestando atenção KKKK, obrigado fera!