Entrar Ainda não tem acesso?
3
respostas

Erro na validação do peso e altura

Referente ao curso JavaScript: programando na linguagem da web, no capítulo Variáveis e Operadores e atividade Operadores Lógicos

por Raphael
| 211.6k xp | 120 posts

Se somente o segundo paciente esta com o peso invalido ele considera todos os de baixo errado tambem Não sei como consertar

var pacientes = document.querySelectorAll('.paciente')
pesoValido = true;
alturaValido = true;
let erros = [];

pacientes.forEach(paciente => {
    var Peso = paciente.querySelector('.info-peso').textContent
    var Altura = paciente.querySelector('.info-altura').textContent
    var imc = paciente.querySelector('.info-imc');
    validaIMC(Peso,Altura);

    imc.textContent = calculaIMC(Peso,Altura);

});


function validaIMC(Peso, Altura){
    if(Peso < 0 || Peso > 1000) {
        pesoValido = false; 
        console.log("peso invalido")
        erros.push("peso invalido");
    }
    if(Altura < 0 || Altura > 5.00) {
        alturaValido = false;
        erros.push("altura invalida");
    }
}

function calculaIMC(peso,altura){

    if(pesoValido && alturaValido){
        return (peso / (altura * altura)).toFixed(2);
    }else{
        return erros;
    }

}

HTML

<!DOCTYPE html>
<html lang="pt-br">
    <head>
        <meta charset="UTF-8">
        <title>Aparecida Nutrição</title>
        <link rel="icon" href="favicon.ico" type="image/x-icon">
        <link rel="stylesheet" type="text/css" href="css/reset.css">
        <link rel="stylesheet" type="text/css" href="css/index.css">

    </head>
    <body>

        <header>
            <div class="container">
                <h1 class="titulo">Aparecida Nutrição</h1>
            </div>
        </header>
        <main>
            <section class="container">
                <h2>Meus pacientes</h2>
                <table>
                    <thead>
                        <tr>
                            <th>Nome</th>
                            <th>Peso(kg)</th>
                            <th>Altura(m)</th>
                            <th>Gordura Corporal(%)</th>
                            <th>IMC</th>
                        </tr>
                    </thead>
                    <tbody id="tabela-pacientes">
                        <tr class="paciente" >
                            <td class="info-nome">Paulo</td>
                            <td class="info-peso">100</td>
                            <td class="info-altura">4.00</td>
                            <td class="info-gordura">10</td>
                            <td class="info-imc">0</td>
                        </tr>

                        <tr class="paciente" >
                            <td class="info-nome">João</td>
                            <td class="info-peso">80</td>
                            <td class="info-altura">2</td>
                            <td class="info-gordura">40</td>
                            <td class="info-imc">0</td>
                        </tr>

                        <tr class="paciente" >
                            <td class="info-nome">Erica</td>
                            <td class="info-peso">54000</td>
                            <td class="info-altura">1.64</td>
                            <td class="info-gordura">14</td>
                            <td class="info-imc">0</td>
                        </tr>

                        <tr class="paciente">
                            <td class="info-nome">Douglas</td>
                            <td class="info-peso">85</td>
                            <td class="info-altura">1.73</td>
                            <td class="info-gordura">24</td>
                            <td class="info-imc">0</td>
                        </tr>
                        <tr class="paciente" >
                            <td class="info-nome">Tatiana</td>
                            <td class="info-peso">46</td>
                            <td class="info-altura">1.55</td>
                            <td class="info-gordura">19</td>
                            <td class="info-imc">0</td>
                        </tr>
                    </tbody>
                </table>

            </section>
        </main>
        <script src="js/principal.js"></script>
    </body>
</html>
3 respostas
por Gabriel Leite
| 3485k xp | 5398 posts
Instrutor

Boa tarde, Raphael! Como vai?

No console do navegador aparece alguma mensagem de erro? Se sim, vc poderia colar ela aqui, por favor? Assim poderei te ajudar de forma mais eficaz.

Qualquer coisa é só falar!

Grande abraço e bons estudos, meu aluno!

por Raphael
| 211.6k xp | 120 posts

Nada mas eu coloquei o codigo do CodePen para você dar uma olhada https://codepen.io/rapha1908/pen/RwNOjmd

por mbthales
| 200.1k xp | 165 posts

Olá Raphael, tudo bem?

Você deveria apenas colocar um else e alterar o segundo if para if else no seu código: 

function validaIMC(Peso, Altura) {
  if (Peso < 0 || Peso > 1000) {
    pesoValido = false;
    console.log("peso invalido");
    erros.push("peso invalido");
  }
  else if(Altura < 0 || Altura > 5.0) {
    alturaValido = false;
    erros.push("altura invalida");
  } else{
    alturaValido = true;
    pesoValido = true;
  }
}

Do jeito que estava, quando o peso ou altura fosse inválida, a variável pesoValido ou alturaValida seria false. Com isso, na próxima iteração do forEach, a função validaIMC não retornaria nada quando os valores não se encaixassem na comparação if, assim, as variáveis ainda seriam false mesmo com os valores permitidos. Diante disso, a função calculaIMC sempre iria retornar os erros a partir do momento que pesoValido ou alturaValida fosse false.

Espero ter ajudado!