Masked Input Plugin, es una manera de validar los datos con formato correcto

DESCARGA : Masked Input Plugin

Masked Input Plugin, es una manera de validar los datos con formato correcto, ya que este plugin en jQuery permite darle formato a una determinada información antes de ser ingresada, permite validar datos previamente.

Entre los datos que se podrían mencionar esta la siguiente lista:

Fecha: 99/99/9999
Teléfono: (999) 999-9999
Teléfono + Ext: (999) 999-9999? x99999
Matrícula: 99-9999999
SSN: 999-99-9999
Llave de un producto como: *-999-a999
Otros formatos: ~9.99 ~9.99 999

Una de las principales ventajas que tiene este plugin es que es muy flexible en cuanto al uso y amigable en su totalidad, la menera de utilizar este plugin es muy sencilla y es de la siguiente forma:

Tenemos que incluir las referencias del framework jQuery y del plugin  maskedinput.js

<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.maskedinput.js" type="text/javascript"></script>

Posteriormente hay que crear los objetos para las etiquetas de los inputs, y agregando las referencias correspondientes a los identificadores de dichas etiquetas.

Demostración: http://digitalbush.com/projects/masked-input-plugin/

Ejemplo para un tipo de etiqueta:

jQuery(function($){
 $("#date").mask("99/99/9999");
 $("#phone").mask("(999) 999-9999");
 $("#tin").mask("99-9999999");
 $("#ssn").mask("999-99-9999");
});

Podrías obtener un resultado de este tipo:


You may also like...

  • Antonio Sanchez

    esta interesante cuando se quiere manejar mascaras en los textbox para tener un formato de texto, pero tengo una duda como seria para un rango digamos de -99 a 99 por ejemplo

  • Develoteca

    Hola que tal Antonio, podrías apoyarte
    o mezclar varios plugins, o modificar el código y generar un nuevo método en el
    plugin Mask(La validación se hace por medio expresiones regulares que te puedes
    encontrar en la línea 24) para obtener esta funcionalidad adicional tambien puedes usar : http://jqueryvalidation.org/range-method/ que es un plugin muy bueno.

  • Arturok Perales Valenzuela

    Hola, espero que aun este vigente este post. Es muy buena la explicación sobre el uso del plugin, lo que quiero saber es como hacer para al momento de procesar la información ya sea antes de enviarla al servidor o una vez enviado (con php) como quitar la mascara y obtener el dato original, ya que la mascara solo serviría como forma de presentación, el dato almacenado tiene que estar sin esta mascara, espero explicarme y me puedan ayudar, salidos…