Validar Ingreso de campo numerico sin punto decimal

oscarbt · #1 (**permalink**) 06/10/2010, 12:48

Buenas a todos, estoy elaborando un pequeño algoritmo para calcular el area de un poligono de n lados, cuando hablo de n, el poligono puede tener de 1 a 1000000 de lados, entonces lo que quiero validar que el usuario cuando me ingrese el numero de lados, solo ingrese valores enteros sin comas decimales..

Es decir que solo ingrese: 1, 2, 250, pero no 1.5, 2.6
Por ahora tengo validado que no ingrese ni valores negativos, ni caracteres, ni superiores a 1000000

Aca el codigo de mi algoritmo:

Código HTML:

Ver original<html>
 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Poligonos</title>
 
</head>
 
<body>
<h1><b>CALCULO DE AREA Y PERIMETRO DE UN POLIGONO </b></h1>
 
 
<form name="datos">
 
 
    <h3>NUMERO DE LADOS </h3>
 
  <input  type="text" name="lado" size="10" maxlength="7" />
  <h3>VALOR DEL LADO </h3>
 
  <input  type="text" name="valor" size="10" />
 <h3>VALOR APOTEMA </h3>
 
  <input  type="text" name="apotema" size="10"  /><br>
   
   
   <h3>VALOR PERIMETRO </h3>
<input type="text" name="perimetro">
 
  <h3>VALOR AREA </h3>
<input type="text" name="resultado"><br>
   <br>
     
 
    <br>
    
  <input type="button" value="Calcular valores" onClick="area()"> <input name="Limpiar"  type="reset" id="Limpiar" value="Borrar valores ingresados ">
 
</form>
 
<br />
</body>
 
</html>

Y aca el codigo JavaScript donde valido (ubicando en el head):

Código Javascript:

Ver original<script languaje="JavaScript">
 function area()
 {
 lado=document.datos.lado.value;
valor=document.datos.valor.value;
apotema=document.datos.apotema.value;
lado = parseFloat(datos.lado.value, 10) 
valor = parseFloat(datos.valor.value, 10) ;
apotema = parseFloat(datos.apotema.value, 10) ;
            if ((document.datos.lado.value.length== "") ||         (document.datos.valor.value.length== "") || (document.datos.apotema.value.length== ""))
               
               {
        alert("EXISTEN VALORES NO INGRESADOS");
        return false;
        
               }
             if ((document.datos.lado.value <= 0) || (document.datos.valor.value <= 0) || (document.datos.apotema.value <= 0))
               
               {
        alert("SOLO PUEDE INGRESAR VALORES POSITIVOS");
        return false;
        
          }
          
           if ((document.datos.lado.value <= 0) ||  (document.datos.lado.value > 1000000))
               
               {
        alert("EL NUMERO DE LADOS DEL POLIGONO ES ENTRE 1 - 1 0 0 0 0 0 0");
        return false;
        
          }
          if ( isNaN(lado) ||   isNaN(valor) || isNaN(apotema))
           {   
        alert("TODOS LOS CAMPOS DEBEN SER VALORES NUMERICOS");
                
        return false  ; 
 
        }
          
          
              
            perimetro=lado*valor;
            
            
            document.datos.perimetro.value=perimetro;
             document.datos.resultado.value=perimetro*apotema/2;
          }
           
     
      </script>

El algoritmo funciona y hace los calculos correctamente pero.......Como puedo hacer esa validación para que el usuario no me ingrese puntos decimales??

Agradezco me puedan colaborar

Nano_ · #2 (**permalink**) 06/10/2010, 13:06

Saludos

Una idea podria ser!..utiliza onkeypress dentro del input a validar, busca el keyCode del punto y creas una funcion de js para ello.

_cronos2 · #3 (**permalink**) 06/10/2010, 13:28

Prueba:

Código Javascript:

Ver originalfunction num(c){
 c.value=/^\d+$/.test(c.value)?c.value:c.value.substr(0,c.value.length-1);
}

Código HTML:

Ver original<input type="text" onkeyup="num(this);" onblur='num(this);' />

Saludos (:

oscarbt · #4 (**permalink**) 06/10/2010, 13:52

excelente, funciona perfectamente gracias

oscarbt · #5 (**permalink**) 06/10/2010, 14:13

Ahora me surge una duda, he probado el codigo, y me borra tambien terminos de tipo caracter

Como puedo dejarlo para que solo me haga lo mismo pero con letras?..

Que acepte puntos, pero no letras ni operadores aritmeticos?

Seria asi ??

Código Javascript:

Ver originalfunction num(c){
 c.value=/^\d+$/test(c.value)?c.value:c.value.substr(0,c.value.length-1);
}

_cronos2 · #6 (**permalink**) 06/10/2010, 14:17

Prueba así:

Código Javascript:

Ver originalfunction num(c){
 c.value=/^(\d+|\d+\.|\d+\.\d+)$/.test(c.value)?c.value:c.value.substr(0,c.value.length-1);
}

Saludos (:

oscarbt · #7 (**permalink**) 06/10/2010, 15:05

Sirve, pero si la una tecla se deja oprimida por unos segundos, si recibe las letras, aunque eso seria ya como si el usuario a las malas quisiera ingresar la letra....jejeje

_cronos2 · #8 (**permalink**) 07/10/2010, 07:15

Ya, estuve buscando una solución para eso pero no se me ocurrió nada

Si consigo algo lo posteo, y si alguien sabe de algún código que lo postee también.
Saludos (:
Edit: Prueba con este, es un poco menos 'vistoso' (cuando lo pruebes lo entenderás), pero funciona:

Código Javascript:

Ver originalfunction num(c){
 c.value=c.value.replace(/[A-z-\/\*\+]/, '');
}

Código HTML:

Ver original<input type="text" onblur="num(this);" onkeypress="num(this);" onkeyup="num(this);" />