Validar numero entero en campo de formulario

Your ads will be inserted here by
Easy Plugin for AdSense.
Please go to the plugin admin page to
Paste your ad code OR
Suppress this ad slot.
Script para validar un campo de formulario de manera que sepamos seguro que dentro del campo hay siempre un número entero
Supongamos que tenemos un campo de un formulario donde queremos que figure siempre un valor numérico entero. Un ejemplo podría ser un campo donde queremos guardar el número de un año, donde, lógicamente, no caben decimales ni tampoco letras. En este ejercicio vamos a realizar un script que procure obtener un número entero del valor que haya escrito el usuario en un campo de texto. Si es un entero o puede convertirlo a un entero, coloca dicho valor entero en el campo. Si no puede obtener un valor numérico entero borra el contenido del campo y lo deja vacío. Lo haremos con Javascript, ya que es el lenguaje del lado del cliente –para operar en el ámbito del navegador- más extendido.
Este ejercicio sirve también para aprender a manejar las funciones incorporadas de Javascript parseInt() e isNaN(). La primera sirve para convertir un valor a número entero y la segunda para ver si un dato es un valor numérico. Otro tema importante que hay que conocer es la jerarquía de objetos del navegador, pero en este caso haremos un esfuerzo en explicarla para aquellas personas que no la conozcan. Función validarEntero() Primero vamos a realizar una función que hará la mayor parte del trabajo, puesto que es la encargada de validar si un dato es un número entero. Esta función recibe un valor, que es el dato que deseamos validar y si es un entero lo devolverá tal cual. Si no lo es, lo intentará convertir a entero y si lo consigue devolverá ese valor. Finalmente, si el intento de convertirlo no da resultado, devolverá una cadena vacía. function validarEntero(valor){ //Compruebo si es un valor numérico Formulario Vemos el formulario que necesitaremos para colocar el campo de texto. Es un formulario como otro cualquiera, el único detalle es que nos hemos preocupado por darle nombre tanto al formulario en si como al campo de texto. Posteriormente utilizaremos esos nombres para referirnos a los elementos mediante Javascript. También tenemos un campo de formulario de tipo botón, que sirve en este caso para indicar que cuando se pulse se llamará a la función validarFormulario(). Para indicar esto se utiliza el atributo onclick del campo botón y entre comillas podemos ver lo que queremos que se ejecute, en este caso la función indicada. Your ads will be inserted here by Easy Plugin for AdSense. Please go to the plugin admin page to
Función validarFormulario() Esta función extrae el dato del campo de texto y lo pasa a la función validarEntero(), que nos devolverá un valor que tendremos que colocar de nuevo en el campo de texto. Para acceder al formulario utilizamos la jerarquía de objetos del navegador, que para el que no lo sepa, es un conjunto de objetos que hacen referencia a todos los elementos de la página. El acceso a los elementos de la página se realiza empezando en el objeto window, que es el primero de la jerarquía. Luego continúa por el objeto document –que guarda todo el documento- y en nuestro ejemplo, bajaremos al formulario para poder acceder definitivamente al campo de texto, que era donde queríamos llegar. Con este esquema: window.document.formul.texto Nos fijamos que se utilizan los nombres del formulario y el campo que hemos colocado en el atributo name de las etiquetas HTML de estos elementos. Todos los campos de texto tienen una propiedad value que es donde se guarda el texto que lleva escrito dentro. De modo que si queremos acceder a lo que tiene escrito el campo de texto escribiremos esto: window.document.formul.texto.value Ahora que sabemos todo lo anterior deberíamos entender perfectamente el código de la función. function validarFormulario(){ Conclusión Con todo esto tenemos completado el ejercicio. Por si sólo puede que no haya resultado muy productivo este ejemplo, pero puede ser un comienzo para empezar a validar formularios más complejos. Con un poco de imaginación y esfuerzo podemos hacer funciones que validen otros campos del formulario para ver si lo que contienen son textos, si son lo suficientemente largos o cortos, validar números con decimales, etc. Todo ello se haría de manera similar a como hemos visto, añadiendo código a la función validarFormulario() y tal vez construyendo algunas funciones accesorias adicionales como validarEntero(). |