validar DNI con javascript

validar dni con javascript en blog diseño páginas web en Lanzarote
k

9 abril 2020

Comparte | Share

Validación del Dni con Javascript código

En este artículo vamos a ver cómo validar un dni con Javascript. A través de código javascript comprobamos si un DNI – documento nacional de identidad español – que introducimos en un formulario es correcto o no.

Un dni está formado por una parte numérica y otra parte que es una letra. Este  código comprueba si el dni es correcto al validar dicho número con la letra que debe tener dicho dni.

Cuando ejecutamos este código javascript aparece un pop up o pequeña caja donde se nos pide insertar el número del dni a comprobar.

El prompt que se ve en la primera parte del código es lo que provoca la aparición de ese pop up.

Definimos una variable llamada numero (var numero)

Esta variable en su definición tiene un filtro, el prefijo parseInt , para que de esta forma lo que el usuario inserte en dicho prompt se corresponda con un número entero. Este prefijo parseInt convierte cualquier dato que el usuario inserta en un número entero. 

Una vez tenemos ese número entero, se guarda en la variable numero.

JS


//se le pide al usuario que introduzca su dni
var numero = parseInt(prompt("Introduzca su dni por favor"));

if(numero>"99999999"){
//si el numero es mayor pues se le comunica al usuario
alert("El dni introducido no es valido");
}
else{
//el usuario inserta la letra del dni
var letra_dni = prompt("Introduzca la letra de su dni").toUpperCase();
} 

Una condición indispensable para que el código continúe con su ejecución, es la validación del número que el usuario introduce. Este número debe ser menor de 99999999. Esto se logra con el condicional if.

De no producirse dicha condición, el código no continúa hacia la opción de insertar la letra a través de otro prompt. Y nos alertaría de que el número introducido no es válido.

En cambio, si el número introducido es válido, es decir que es menor de 99999999 nos indica que introduzcamos la letra del dni a validar.

cálculo de la letra del dni

La segunda parte del código consiste en un proceso de cálculo matemático, de acuerdo con la legislación española. Este cálculo se basa en obtener el resto de la división entera del número de DNI y el número 23.

Entendemos por resto de la división entera la cantidad que queda después de una división entre dos números. Por ejemplo 19 dividido entre 3 nos daría como resto de la división entera 1, ya que 6 x 3 = 18 y para llegar a 19 nos falta 1.

Una vez obtenemos el resto de la división, se obtiene la letra que es seleccionada dentro de un array de letras, llamada variable letras.

La letra seleccionada estará en función de la posición de esa letra dentro del array, es decir si el resto obtenido es 5, entonces la letra seleccionada sería la letra que ocupe la posición 5 en el array.

En este caso la ´M´ ocuparía la posición 5. Otro ejemplo es si el resto es 3, la letra correcta para ese dni es la A, que corresponde con la posición 3 del array letras.

JS


//calculamos la diferencia de la división para saber la posición
var resto = numero %23;

var letras = [‘T’, ‘R’, ‘W’, ‘A’, ‘G’, ‘M’, ‘Y’, ‘F’, ‘P’, ‘D’, ‘X’, ‘B’, ‘N’, ‘J’, ‘Z’, ‘S’, ‘Q’, ‘V’, ‘H’, ‘L’, ‘C’, ‘K’, ‘E’, ‘T’]; 

letras = letras.join("");

var encontrado = letras.charAt(resto);

if(letra_dni == encontrado) {
alert("El dni insertado " + numero + "con letra " + letra_dni + " es CORRECTO");
}
else{
alert("El dni insertado " + numero + "con letra " + letra_dni + " es INCORRECTO");
}

Posteriormente al array letras le aplicamos el método join() para así unir todos los elementos del array. Las comillas dentro del paréntesis es el tipo de separador a tener en cuenta.

Definimos la variable encontrado, que es la conversión de letras en una cadena string, con el método charAt().

El último paso de este proceso para validar dni con javascript es comparar la letra que insertamos en un primer momento ( var letra_dni ) con la letra obtenida a través del cálculo matemático (var encontrado) .

Si no coinciden, se muestra un mensaje al usuario que le indica que la letra que insertamos no es correcta.

En caso de que ambas variables sean iguales, se muestra un mensaje que indica el dni es correcto, es decir que el número y la letra de DNI son correctos.

Esta entrada es un ejercicio que los estudiantes de HTML se suelen encontrar en sus proyectos. Creatuwebpymes, somos una empresa de Desarrollo y Diseño de páginas web en Canarias que nos gusta la programación.

Comparte | Share
creatuwebpymes quien somos

Francisco Brito Diaz

CEO de creatuwebpymes.com, empresa de diseño web y marketing digital en Canarias.