Utilización del Diseñador de formularios › Cómo utilizar funciones de JavaScript en los campos › Cómo validar las entradas de los usuarios › Cómo utilizar funciones de JavaScript para validar el formato de los números de tarjeta de crédito

Cómo utilizar funciones de JavaScript para validar el formato de los números de tarjeta de crédito

Este tema explica cómo configurar el Diseñador de formularios para utilizar funciones de JavaScript para verificar que los usuarios hayan introducido un número de tarjeta de crédito en el formato correcto para el tipo de tarjeta de crédito que especificaron. Este proceso no autentica los datos introducidos por el usuario pero ayuda al proceso de validación, ya que verifica el formato.

Nota: Puede utilizar también expresiones regulares para validar el formato de los números de tarjeta de crédito y otros tipos de datos solicitados comúnmente, como números de la seguridad social, direcciones de correo electrónico, números de teléfono, etc.

Este tema explica cómo presentar dos tipos de tarjeta de crédito: MasterCard y Visa. Para cada tipo, se crea una opción de botones de opción y un campo de texto para el número de cuenta. Cada campo de número de cuenta está desactivado por diseño pero se activa si el usuario selecciona el tipo de tarjeta de crédito correspondiente.

Se usa la función JavaScript predefinida llamada ca_fdValidateCC(número, 'tipo') para validar el formato del número de tarjeta de crédito introducido por el usuario, según el tipo de tarjeta de crédito que el usuario haya seleccionado. Esta función JavaScript comprueba el formato según las especificaciones configuradas por la compañía emisora de la tarjeta de crédito. Cada compañía establece su propio formato estándar.

Para verificar los números de tarjeta de crédito introducidos por los usuarios, siga estos pasos. Estos pasos utilizan un ejemplo con el fin de ilustrar el proceso.

1. Diseñe y cree el formulario, si aún no lo ha hecho.
2. Verifique que el valor del atributo HTML llamado _id del formulario especifique un nombre significativo, como ccValdtnForm1.
3. Agregue botones de opción; son uno de los elementos de los formularios.
   1. Para el valor del atributo _id de los botones de opción, especifique un nombre significativo, como rgCCVal, y guarde el formulario.
   2. Cambie el nombre de "Botones de opción" a uno significativo, como Seleccionar tarjeta de crédito o Tipo de tarjeta de crédito.
4. Agregue la primera opción de los botones de opción; estas opciones son elementos de un formulario que se aplican solamente a los botones de opción.
   1. Para el atributo _id, especifique un nombre significativo, como mcard (es decir, botones de opción para MasterCard), y guarde el formulario.
   2. Cambie el nombre "Botón de opción" a uno significativo, como MasterCard.
5. Agregue la segunda opción de los de botones de opción.
   1. Para el atributo _id, especifique un nombre significativo, como Visa (es decir, botones de opción para Visa), y guarde el formulario.
   2. Cambie el nombre "Botón de opción" a uno significativo, como Visa.
6. Agregue un campo de texto al formulario.
   1. Para el atributo _id, especifique un nombre significativo, como ccf.
   2. Para el valor del atributo de JavaScript llamado onvalidate, especifique cc_val(_val).
7. En su biblioteca de JavaScript personalizada, agregue la definición de función siguiente.

   Nota: Como procedimiento recomendado, utilice custom_form_lib.js en el almacén de archivos como biblioteca de JavaScript personalizada. Para obtener más información sobre la configuración del almacén de archivos, consulte la Guía de implementación.

   function cc_val(value) {
                   var ccname = '';
                   if (ca_fdIsSelectRadio('ccValdtnForm1', 'rgCCVal', 'mcard'))
                                   ccname = 'master';
                   else
                                   ccname = 'visa';
                   ca_fdValidateCC(value, ccname);
   }
   

8. Termine de crear el formulario según los requisitos.
9. Pruebe el formulario para verificar que funciona como pretendía.

Como procedimiento recomendado, asegúrese de probar el formulario en un servicio en un entorno de prueba antes de utilizar el formulario y el servicio en un entorno de producción.