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

Nova coluna: Resultado.

Olá, gente, boa tarde! Resolvi pôr em prática o que aprendi até a aula 5, vídeo 3 e criei uma nova coluna. Essa coluna se chama resultado. Ela verifica o valor do IMC gerado pela função calculaImc(peso, altura) e diz em que situação a pessoa está de acordo com o seu peso. Minha questão é a seguinte: Quando eu insiro um novo paciente no formulário, minha última coluna(que é a nova, Resultado) da última linha(Paciente Tatiana) atualiza junto com o Resultado do novo paciente. E eu não sei o que fazer xD. Help? Segue meu código:

HTML:

<tr class="paciente" id="primeiro-paciente">
td class="info-nome" >Paulo</td>
    <td class="info-peso">100</td>
    <td class="info-altura">25.00</td>
    <td class="info-gordura">10</td>
    <td class="info-imc">0</td>
    <td class="info-resultado"></td>    //Nova Coluna adicionada
</tr>

JavaScript: calcula-Imc.js

var pacientes = document.querySelectorAll(".paciente");

for(var i = 0; i < pacientes.length; i++){

    var paciente = pacientes[i];
    var peso = paciente.querySelector(".info-peso").textContent;
    var altura = paciente.querySelector(".info-altura").textContent;
    var imc = paciente.querySelector(".info-imc");
    var resultado = paciente.querySelector(".info-resultado");
    var pesoEhValido = true;
    var alturaEhValida = true;

    if( peso <= 0|| peso >=1000 ){
        pesoEhValido = false;
        imc.textContent = "Peso inválido!";
        resultado.textContent = "Resultado incalculável";
        paciente.classList.add("paciente-invalido");
    }

    if (altura <=0 || altura >= 3){
        alturaEhValida = false;
        imc.textContent = "Altura inválida!"
        resultado.textContent = "Resultado incalculável";
        paciente.classList.add("paciente-invalido");
    }

    if(pesoEhValido && alturaEhValida){

        var totalImc = calculaImc(peso, altura);
        imc.textContent = totalImc;
        resultado.textContent = valorResultado(totalImc);

    }
}

function calculaImc(peso, altura){
    var imc = peso / (altura * altura);
    return imc.toFixed(2);
}
//Função que gera o resposta de acordo com o resultado do IMC
function valorResultado(totalImc){
        if (totalImc <= 18.5){
            resultado.textContent = "Abaixo do Peso";
        }else if(totalImc > 18.5 && totalImc < 25){
            resultado.textContent = "Peso ideal";
        }else if(totalImc >= 25 && totalImc < 30){
            resultado.textContent = "Levemente acima do peso";
        }else if(totalImc >=30 && totalImc < 35){
            resultado.textContent = "Obesidade grau I";
        }else if(totalImc >= 35 && totalImc <40){
            resultado.textContent = "Obesidade grau II(severa)";
        }else{
            resultado.textContent = "Obesidade grau III(mórbida)";
        }
        return resultado.textContent;
}

form.js

var botaoAdicionar = document.querySelector(".botao");
botaoAdicionar.addEventListener("click", function(event){
    event.preventDefault();
    var form = document.querySelector("#form-adiciona");

    var nome = form.nome.value;
    var peso = form.peso.value;
    var altura = form.altura.value;
    var gordura = form.gordura.value;

    var pacienteTr = document.createElement("tr");
    pacienteTr.classList.add("paciente");

    var nomeTd = document.createElement("td");
    nomeTd.classList.add("info-nome");
    var pesoTd = document.createElement("td");
    pesoTd.classList.add("info-peso");
    var alturaTd = document.createElement("td");
    alturaTd.classList.add("info-altura");
    var gorduraTd = document.createElement("td");
    gorduraTd.classList.add("info-gordura");
    var imcTd = document.createElement("td");
    imcTd.classList.add("info-imc");
    var resultadoTd = document.createElement("td");
    resultadoTd.classList.add("info-resultado");

    nomeTd.textContent = nome;
    pesoTd.textContent = peso;
    alturaTd.textContent = altura;
    gorduraTd.textContent = gordura;
    total = calculaImc(peso,altura);      //Calcula o IMC
    imcTd.textContent = total;
    resultadoTd.textContent = valorResultado(total); // Esta linha muda a última coluna, da última linha populada(Paciente Tatiana) no index.html. 

    pacienteTr.appendChild(nomeTd);
    pacienteTr.appendChild(pesoTd);
    pacienteTr.appendChild(alturaTd);
    pacienteTr.appendChild(gorduraTd);
    pacienteTr.appendChild(imcTd);
    pacienteTr.appendChild(resultadoTd);

    var tabela = document.querySelector("#tabela-pacientes");
    tabela.appendChild(pacienteTr);
});

Sou grato, de coração! Rafael Barbosa.

3 respostas
solução!

Dae Rafael! Seguinte, a tua função aqui: function valorResultado(totalImc){

Tem vários "resultado.textContent = xxxxxxxx", um dentro de cada "If". A variável resultado é a última disponível lá daquele seu "for(xxxx)", que no seu caso é a Tatiane. var resultado = paciente.querySelector(".info-resultado");

Por isso sempre atualiza lá.

Como o que você quer aqui no teu exercício é fazer voltar um texto, você pode:

function valorResultado(totalImc){

var retorno = ""
    if (totalImc <= 18.5){
        retorno  = "Abaixo do Peso";
    }else if(totalImc > 18.5 && totalImc < 25){
       retorno  = "Peso ideal";
    }else if(totalImc >= 25 && totalImc < 30){
        retorno t = "Levemente acima do peso";
    }else if(totalImc >=30 && totalImc < 35){
       retorno  = "Obesidade grau I";
    }else if(totalImc >= 35 && totalImc <40){
        retorno  = "Obesidade grau II(severa)";
    }else{
        retorno  = "Obesidade grau III(mórbida)";
    }
    return retorno ;

}

Ou então faz o return direto:

function valorResultado(totalImc){

    if (totalImc <= 18.5){
        return = "Abaixo do Peso";
    }else if(totalImc > 18.5 && totalImc < 25){
       return = "Peso ideal";
    }else if(totalImc >= 25 && totalImc < 30){
        return  "Levemente acima do peso";
    }else if(totalImc >=30 && totalImc < 35){
       return = "Obesidade grau I";
    }else if(totalImc >= 35 && totalImc <40){
        return = "Obesidade grau II(severa)";
    }else{
        return = "Obesidade grau III(mórbida)";
    }

}

**Talvez falte um ; em algum lugar do meu código. Como escrevi aqui direto, vale uma revisãozinha.

Um abraço.

Thiago, muito obrigado! Eu criei a variável retorno, como você disse lá em cima e funcionou perfeitamente! Muito obrigado pelo tempo disponibilizado a me ajudar!

Valeu Rafael!

Feliz por ter ajudado!

Bons estudos!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software