• Skip to primary navigation
  • Skip to main content
  • Skip to footer

Cursos online y materiales digitales para estudiantes y desarrolladores web

  • CURSOS
  • BLOG
  • QUIÉN SOY
  • FAQ
  • ACCEDER
  • CONTACTO

Reto: Los Hombres de Paco hacen DNIs

Publicado el 22/06/2020 por Ada 8 Comments

Los Hombres de Paco

Los hombres de Paco

Programación

Eventos y cálculos


Acceder al reto en formato vídeo

Quién nos iba a decir que los intrépidos Hombres de Paco iban a acabar en la oficina de expedición de DNIs y pasaportes de la Comisaría de San Antonio.

Fue Paco Miranda quien contactó con nosotros para pedirnos una funcionalidad más que evidente en una delegación como la suya: necesitaba hacer una calculadora de la letra del NIF y del NIE, algo que nos pareció muy útil para cualquier página web que necesitara almacenar este tipo de información. El mensaje decía así:

¡Hola, Ada y Edu!
Soy Paco Miranda, inspector jefe en la Comisaría de San Antonio.
Estamos implementando una funcionalidad en nuestra aplicación de creación de NIFs y NIEs y necesitamos una calculadora de la letra de control. Pero es importante que entendáis la diferencia entre un NIF y un NIE.
– Los NIFs están formados por 8 dígitos y una letra de control.
– Los NIEs están formados por una letra (X, Y o Z), 7 dígitos y una letra de control. Estas letras iniciales equivalen a 0, 1 o 2 respectivamente de cara a hacer los cálculos.
Te facilito un enlace donde se explica cómo calcular ese dígito de control.
Necesitamos un formulario con dos campos: en el primero se introduce los dígitos del NIF o NIE y en el segundo debería aparecer automáticamente la letra correspondiente. ¿Nos echáis una mano?

Edu puso la puntilla sobre el mensaje de Paco, como siempre:

Necesitarás una expresión regular para validar los datos del input, ¿verdad? ¿Qué evento utilizarás para comprobar que el campo de los dígitos está completo? ¿Vas a utilizar un array o una cadena para almacenar las letras? Mmmmmm… ¿crees que Sara Miranda seguirá con Lucas?

La verdad es que me hizo pensar: tendría que darle una vuelta al tema de los eventos asociados al input, ¿al levantar una tecla? ¿al perder el foco? ¿al hacer click?

¿Tú cómo lo harías? ¡Espero tus propuestas en los comentarios!

Y si quieres compartir código, te recomiendo que utilices alguna herramienta online de testing de código como Codepen, JSFiddle, PlayCode, etc. o repositorios como GitHub, GitLab, BitBucket…

Filed Under: Reto Tagged With: dni, javascript, nif, validar

Reader Interactions

Comments

  1. José Julio says

    22/06/2020 at 19:53

    Este reto es bien fácil

    Accede para responder
    • Ada Lovecode says

      22/06/2020 at 19:59

      Jejejeje… sí, ¿verdad? Lo más “complicado” es el esperar que hayan metido 8 dígitos para sacar la letra del NIF/NIE… controlar los eventos. El cálculo en sí está chupao 😉

      Accede para responder
  2. FEDERICO MACÍAS says

    23/06/2020 at 00:25

    Wow, nuevo reto. Muchísimas gracias, Ada.
    Coincido en que en sí no está difícil el planteamiento, lo que espero que ya no me ocasione problemas sea a la hora de añadirle el manejador de eventos al botón como siempre.

    Accede para responder
  3. FEDERICO MACÍAS says

    23/06/2020 at 21:29

    Hola Ada. Dejo aquí la resolución al reto en liga de codepen https://codepen.io/Scipio14/details/oNbWdQr.
    Gracias a tus consejos es la primera vez que me sale el EventListener en el botón y creo que el código está más ordenado.
    Afortunadamente no es un curso de CSS que si no…

    Sé que podría haber puesto validaciones con expresiones regulares y un botón para limpiar los campos, pero al menos cumple con lo que se pedía de los inputs y capaz de que intento otra cosa y me sale peor y lo de las expresiones regulares pues aun me hago un lío con ellas.

    Al menos es el primer reto que me sale, jejeje.

    Accede para responder
  4. Ada Lovecode says

    29/06/2020 at 23:48

    ¡Uau! Veo que has tenido en cuenta muchísimas comprobaciones, ¡buen trabajo, Bladimir! 🙂
    La verdad es que tengo poco que decir, ¡está muy bien! Quizá, como siempre digo, lo ideal es separar estructura de estilos y de funcionalidad (HTML de CSS y de JS) pero por comodidad y para subir al repositorio en un ejemplo como este está perfecto.
    ¡A seguir así! 🙂

    Accede para responder
  5. Ada Lovecode says

    29/06/2020 at 23:55

    ¡Vaya, Juan! ¡Esto va tomando forma, ¿eh?! ¡Muy bien!
    Las variables tienen nombres representativos, el código está modularizado… ¡y el ejercicio está muy bien planteado!
    ¡Enhorabuena porque lo estás haciendo muy bien! 🙂

    Accede para responder
    • Juan says

      03/07/2020 at 21:50

      muchísimas gracias!!!
      Todo gracias a que tu nos ayudas a mejorar

      Accede para responder

Trackbacks

  1. Reto resuelto: Los Hombres de Paco hacen DNIs dice:
    18/11/2020 a las 21:34

    […] Reto: Los Hombres de Paco hacen DNIs […]

    Accede para responder

Deja una respuesta Cancelar la respuesta

Lo siento, debes estar conectado para publicar un comentario.

Footer

Didacticode

Cursos para estudiantes y docentes del mundo de la informática.
Retos: retos resueltos de programación.
Tips&Tricks: trucos y consejos.
Boleticodes: boletines de noticias.
Quiénes somos: Ada, Edu... y Laura.
Contacto¡Contacta conmigo!

Legal

Aviso legal
Política de privacidad
Cookies

Redes Sociales

Youtube
Twitter
Instagram
Facebook
Twitch
LinkedIn
Gitlab
Github

Didacticode © 2023

¡Cómo no! Este sitio también utiliza cookies para mejorar la experiencia de tu visita.

Puedes informarte más sobre qué cookies estamos utilizando o desactivarlas en los AJUSTES.

Resumen de privacidad
Didacticode

Esta web utiliza cookies para que podamos ofrecerte la mejor experiencia de usuario posible. La información de las cookies se almacena en tu navegador y realiza funciones tales como reconocerte cuando vuelves a nuestra web o ayudar a nuestro equipo a comprender qué secciones de la web encuentras más interesantes y útiles.