Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

Required HTML

por Guilherme Martins Barbosa Rabelo
| 79.4k xp | 4 posts
insira seu código aqui

Alguém sabe me dizer por que esse required não esta funcionando? Já tentei de tudo

<section class="container">
            <h2 id="titulo-form">Adicionar novo paciente</h2>
            <ul id="mensagens-erro"></ul>
            <form id="form-adiciona">
                <div class="">
                    <label for="nome">Nome:</label>
                    <input id="nome" name="nome" type="text" required placeholder="digite o nome do seu paciente" class="campo">
                </div>
                <div class="grupo">
                    <label for="peso">Peso:</label>
                    <input id="peso" name="peso" type="number" required placeholder="digite o peso do seu paciente" class="campo campo-medio">
                </div>
                <div class="grupo">
                    <label for="altura">Altura:</label>
                    <input id="altura" name="altura" type="text" required placeholder="digite a altura do seu paciente" class="campo campo-medio">
                </div>
                <div class="grupo">
                    <label for="gordura">% de Gordura:</label>
                    <input id="gordura" type="number" required placeholder="digite a porcentagem de gordura do seu paciente" class="campo campo-medio">
                </div>

                <button id="adicionar-paciente" class="botao bto-principal">Adicionar</button>
            </form>
        </section>
4 respostas
por Gabriel Leite
| 3485k xp | 5398 posts
Instrutor

Boa noite, Guilherme! Como vai?

O que não deu certo pra vc? Eu criei esse código que está ao final do meu comentário e funcionou corretamente! Veja se com ele as coisas funcionam pra vc!

Qualquer coisa é só falar!

Grande abraço e bons estudos, meu aluno!

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Formulário de cadastro</title>
</head>
<body>
    <section class="container">
        <h2 id="titulo-form">Adicionar novo paciente</h2>
        <ul id="mensagens-erro"></ul>
        <form id="form-adiciona">
            <div class="">
                <label for="nome">Nome:</label>
                <input id="nome" name="nome" type="text" required placeholder="digite o nome do seu paciente" class="campo">
            </div>
            <div class="grupo">
                <label for="peso">Peso:</label>
                <input id="peso" name="peso" type="number" required placeholder="digite o peso do seu paciente" class="campo campo-medio">
            </div>
            <div class="grupo">
                <label for="altura">Altura:</label>
                <input id="altura" name="altura" type="text" required placeholder="digite a altura do seu paciente" class="campo campo-medio">
            </div>
            <div class="grupo">
                <label for="gordura">% de Gordura:</label>
                <input id="gordura" type="number" required placeholder="digite a porcentagem de gordura do seu paciente" class="campo campo-medio">
            </div>

            <button id="adicionar-paciente" class="botao bto-principal">Adicionar</button>
        </form>
    </section>
</body>
</html>
por Matheus Henrique Castiglioni
| 5307.1k xp | 9007 posts
Instrutor Senior Software Engineer

Fala aí Guilherme, tudo bem? O código está correto, eu testei ele aqui e funcionou.

Espero ter ajudado.

solução!
por Guilherme Martins Barbosa Rabelo
| 79.4k xp | 4 posts

Primeiramente, obrigado pelas respostas e tentativas. Depois de ver e rever muitas vezes o código, no meu arquivo JS eu estava usando o "event.preventDefault()" que tira os eventos "padrões" de acontecerem e por consequência também tira do HTML. Depois de tirar esse evento deu certo, porém mais uma vez obrigado!!!

var botaoAdicionar = document.querySelector("#adicionar-paciente");
botaoAdicionar.addEventListener("click", function(event) {
    event.preventDefault();

    var form = document.querySelector("#form-adiciona");

    var paciente = obtemPacienteDoFormulario(form);
por Gabriel Leite
| 3485k xp | 5398 posts
Instrutor

Que bom que encontrou a solução, Guilherme! Agora é só correr pro abraço e continuar a sua evolução nos estudos!

Sempre que precisar de alguma ajuda é mandar aqui no fórum!

Grande abraço e bons estudos, meu aluno!