validação de input type number e type text em javascript[RESOLVIDO]

1. validação de input type number e type text em javascript[RESOLVIDO]

dark777
(usa Debian)

Enviado em 05/06/2024 - 17:17h

E ae Galera do JavaScript blz?

fiz uma função em javascript para validar inputs relacionado a altura de uma pessoa para calculo de IMC, entao tenho isso em html:



          <div class="form-group">

            <label class="ml-1">Altura em metros/centímetros: </label>

            <input class="form-control" type="text" id="alturaPessoa" name="altura" min="1" max="250"

              oninput="validaAltura(this)" placeholder="ex: 40cm à 250cm ou 1.10m à 2.50m">

          </div>

e fiz esta função em JavaScript:



function validaAltura(input) {



	let altura = parseInt(input.value);



	if (altura !== "" && (altura < input.min || altura > input.max)) {



		alert("Altura deve estar entre 40 e 250 centímetros!\nInput max: " + input.max + " centímetros!");



		input.value = ""; // Limpa o valor inserido

	}



	let altura2 = parseFloat(input.value);



	if (altura2 !== "" && (altura2 < parseFloat(input.min) || altura2 > parseFloat(input.max))) {



		alert("Altura deve estar entre 1 e 2.50 metros!\nInput max: " + parseFloat(input.max) + " centímetros!");



		input.value = ""; // Limpa o valor inserido

	}

}

quando a pessoa digita 251 ele esta validando mas se a pessoa digitar "2.51" ele nao esta verificando o input como fazer isso funcionar corretamente.
PS: nao é minha intenção pegar smente um tipo de valor pois o calculo esta sendo feito tando com valor em centímetros quanto em metros.
wiki.anon

0 0

Quote

2. Re: validação de input type number e type text em javascript[RESOLVIDO]

alexabolada
(usa Debian)

Enviado em 05/06/2024 - 17:17h

Olá! Para validar corretamente o input tanto em centímetros quanto em metros, você pode fazer algumas alterações na sua função validaAltura. Você pode modificar a função para permitir a entrada de valores decimais, como "2.51". Veja como você pode ajustar o código:



function validaAltura(input) {

    

    let altura = parseFloat(input.value.replace(',', '.')); // Substitui "," por "." para garantir que números decimais sejam aceitos

    

    if (!isNaN(altura) && (altura < parseFloat(input.min) || altura > parseFloat(input.max))) { // Verifica se a altura é um número e está dentro do intervalo correto

    

        alert("Altura deve estar entre " + input.min + " e " + input.max + " centímetros!");

        

        input.value = ""; // Limpa o valor inserido

    }

}

Com essas alterações, o seu código deve ser capaz de aceitar valores decimais e validar corretamente a altura tanto em centímetros quanto em metros. Dessa forma, ao digitar "2.51", ele verificará o input corretamente. Espero que isso ajude! Se tiver mais alguma dúvida, fico à disposição para ajudar.

0 0

Quote

3. Re: validação de input type number e type text em javascript[AJUDA]

msoliver
(usa Debian)

Enviado em 05/06/2024 - 19:34h

dark777 escreveu:

E ae Galera do JavaScript blz?

fiz uma função em javascript para validar inputs relacionado a altura de uma pessoa para calculo de IMC, entao tenho isso em html:



          <div class="form-group">

            <label class="ml-1">Altura em metros/centímetros: </label>

            <input class="form-control" type="text" id="alturaPessoa" name="altura" min="1" max="250"

              oninput="validaAltura(this)" placeholder="ex: 40cm à 250cm ou 1.10m à 2.50m">

          </div>

e fiz esta função em JavaScript:



function validaAltura(input) {



	let altura = parseInt(input.value);



	if (altura !== "" && (altura < input.min || altura > input.max)) {



		alert("Altura deve estar entre 40 e 250 centímetros!\nInput max: " + input.max + " centímetros!");



		input.value = ""; // Limpa o valor inserido

	}



	let altura2 = parseFloat(input.value);



	if (altura2 !== "" && (altura2 < parseFloat(input.min) || altura2 > parseFloat(input.max))) {



		alert("Altura deve estar entre 1 e 2.50 metros!\nInput max: " + parseFloat(input.max) + " centímetros!");



		input.value = ""; // Limpa o valor inserido

	}

}

/*----------------------------------------------------------------------------------------------*/
Boa noite Dark, segue....

<!doctype html>

<html>

<head>

<style>

INPUT{width: 25%;}

#err{color:#f00;}

#act{color:#0f0;}

</style>

</head>

<body>

<div>

<label for="alturaPessoa">Altura em metros/centímetros: </label>

<input type="text" id="alturaPessoa" onchange="valida(this)" placeholder="ex: 40cm à 250cm ou 0.4m à 2.5m">

<p id='msg'>msg</p>

</div>

<script>

function valida(t) {

var alt=0, x=t.value;

if ((/[.,]/).test(x)){ //checa se tem virgula ou ponto

alt=(Number(x.replace(/,/,".")))*100; // Se tem "," troca por "." e converte para cm 

}else{

alt=x;

}

if(alt>=40 && alt<=250){

msg.innerHTML="<b id='act'>Okay</b><br>Calcular IMC"

/* Calcular IMC */

}else{

msg.innerHTML="<b id='err'>ERRO!</b><br>Altura deve estar entre 40 e 250 centímetros!";

}

setTimeout(()=>{t.value=''},500);

}

</script></body></html>

______________________________________________________________________

Importante:

lynx --dump https://www.vivaolinux.com.br/termos-de-uso/ | sed -nr '/^[ ]+Se/,/udou.$/s/^[ ]+//p'

______________________________________________________________________

Nota de esclarecimento:

O comando: ACIMA, faz parte da minha assinatura.

Att.: Marcelo Oliver

______________________________________________________________________