¿Hay alguna manera de introducir texto enmascarado en los elementos de BreezingForms?
Vaya a este sitio web:
github.com/digitalBush/jquery.maskedinput
y descargue el archivo comprimido (botón download zip en la parte derecha de la ventana) del plugin Masked Input.
Descomprima el archivo. Cree una nueva carpeta en su servidor (por ejemplo llamada "maskedinput") para guardar allí el contenidoo house the contents. I created mine as follows:
/includes/js/maskedinput/
Ahora suba los archivos y carpetas descomprimidas a la ruta creada en su servidor .../maskedinput/
Una vez haya hecho esto, necesita crear su formulario y vincularlo a un elemento de menú para así poder verlo. Abra la página que contiene el formulario y haga clic en "ver código fuente" (View Source). Ahora tiene que encontrar la ID para cada uno de los elementos que quiera usar con el script Input Mask (En nuestro caso, hemos añadido tres elementos de texto a mi formulario: fecha, teléfono y NIF). Una forma rápida de encontrar esta parte de código es situarse con el ratón sobre el campo, pulsar el botón derecho del ratón e inspeccionar el código fuente. Aquí tiene nuestro código HTML para el elemento 'dato' de nuestro formulario:
Aquí el código HTML para el elemento fecha del formulario:
<input class="ff_elem" type="text" name="ff_nm_date[]"value=""id="ff_elem1534"/>
El identificador ID para el campo fecha se encuentra al final: ff_elem1534. El código ID para el elemento teléfono es el siguiente:
<input class="ff_elem" type="text" name="ff_nm_phone[]" value=""id="ff_elem1535"/>
La ID del ELEMENTO para el campo 'telefono' se encuentra al final ff_elem1535. Tome nota de la ID de los elementos en los que quiera usar las entradas enmascaradas.
Ahora vuelva a las propiedades de su formulario Breezingforms > Avanzado > más opciones > Piezas del formulario. En la sección Antes del Formulario, seleccione el tipo Personalizado, lo que habrirá una área de texto. Añada el siguiente código en dicha ventana:
echo '<script src="/includes/js/maskedinput/src/jquery.maskedinput.js"
type="text/javascript"></script>';
echo '<script>
jQuery(function($){
$("#ff_elem1176").mask("99/99/9999");
$("#ff_elem1177").mask("(999) 999-9999");
$("#ff_elem1178").mask("999-99-9999");
});
</script>';
** NOTA: Si sube los archivos y carpetas de masked Input en un directorio diferente, necesitará cambiar la localización en el src (source) del script. **
Debe cambiar la ID del elemento del ejemplo por la ID de su propio elemento, ajustando así el formato tal y como convenga (consulte la información sobre entrada enmascarada (Input Mask) para ver los formatos disponibles). Ahora haga clic en el botón GUARDAR situado en la parte superior derecha de la ventana para guardar los cambios en su Pieza de Formulario. Después haga clic en el icono GUARDAR situado en la esquina superior izquierda de la pantalla para así guardar el texto. Pruebe el formulario -- ahora debería funcionar.