Tags

JQueryMaskedInput

Homepage: http://digitalbush.com/projects/masked-input-plugin
Author(s): Josh Bush
Version: 1.4.1

This is a masked input plugin for the jQuery javascript library. It allows a user to more easily enter fixed width input where you would like them to enter the data in a certain format (dates,phone numbers, etc). It has been tested on Internet Explorer, Firefox, Safari, Opera, and Chrome. A mask is defined by a format made up of mask literals and mask definitions. Any character not in the definitions list below is considered a mask literal. Mask literals will be automatically entered for the user as they type and will not be able to be removed by the user.The following mask definitions are predefined:

  • a - Represents an alpha character (A-Z,a-z)
  • 9 - Represents a numeric character (0-9)
  • * - Represents an alphanumeric character (A-Z,a-z,0-9)

Usage

The following mask definitions are predefined:
  • a - Represents an alpha character (A-Z,a-z)
  • 9 - Represents a numeric character (0-9)
  • * - Represents an alphanumeric character (A-Z,a-z,0-9)

JavaScript API

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

Use a space instead of an underscore "_" character as a placeholder
$("#product").mask("99/99/9999",{
  placeholder:" "
});

Adda "completed" callback:
$("#product").mask("99/99/9999",{
  completed: function() {
    alert("You typed the following: "+this.val());
  }
});

Define an own mask:
$.mask.definitions['~']='[+-]';
$("#eyescript").mask("~9.99 ~9.99 999");

Foswiki integration

Use the jqMaskedInput class name to enable masked input on an input element. The mask itself is specified in the mask attribute.

Examples

Date:

Phone:

Product Key:

Enter your product key of the form a*-999-a999.
Topic revision: r1 - 23 Feb 2016, ProjectContributor
This site is powered by FoswikiCopyright © by the contributing authors. All material on this site is the property of the contributing authors.
Ideas, requests, problems regarding CLASSE Wiki? Send feedback