Installation instructions for MaskInput

INTRODUCTION

Sometimes you need the user to input data in a particular format like a Social
Security Number or a standard US phone number. By masking input of a particular
textbox, you can change its behavior so that it accepts input only according to
specified format, e.g. a masked phone number input box will only allow 10 digits of
of the phone number to pass through and won?t accept any other input.

The Masked Input module is a wrapper for the Masked Input jQuery Plugin by Josh Bush,
http://digitalbush.com/projects/masked-input-plugin. 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).

INSTALLATION

The Masked Input module requires the Libraries API module
http://www.drupal.org/projects/libraries ) and the Masked Input jQuery plugin
http://cloud.github.com/downloads/digitalBush/jquery.maskedinput/jquery.... )
to function. Place the Masked Input and Libraries API modules in the sites/all/modules
directory and the jQuery plugin in the sites/all/libraries/maskedinput directory.

Enable the modules from the Administration >> Modules page.

USAGE

The Masked Input module is used in Content Type design when adding a Text field. From the
Widget selection, choose Masked Input and click Save. After defining the maximum length and saving
again, you will arrive at a page for more detail on your new field. Define the mask in the Mask
field.

Example: Go to the Manage Fields form for Basic Page (Or create a new content type, and go to Manage
Fields).

  1. Add a new field called Phone Number.
  2. From the Select A Field Type pulldown, select Text.
  3. From the Select A Widget pulldown, select Masked Input.
  4. Click Save.
  5. On the next page, accept the default field length, and click Save.
  6. On the next page, scroll down until you see a field labelled Mask.
  7. In the Mask field, type
    (999) 999-9999
  8. Save settings
  9. Save the content type

When you create a new node of type you created or altered, the Phone Number field will have the following:
(___) ___-____
The field will only accept three numerals inside the parentheses, three numerals before the dash,
and four numerals after the dash. It will not accept letters, only numbers. That is because of the
mask we created in step (7).

ADVANCED

You can create new Mask Defenitions at Administration ? Configuration ? User interface ? Masked Input
(admin/config/user-interface/masked_input).

 

BugFix

Adding this here for anyone else who runs into the issue. I installed everything as described in this post. Drupal's Status Report page showed it was detecting the Masked Input library. However, even though I could set masked input as the type of field and even add all the formatting definitions, it still wouldn't work when I went to add a content type. After peaking at the code for my website, I notice it was looking for jquery.maskedinput-1.3.js

If you don't have "-1.3" in your js file name (which is not there by default when you download it), it won't work. When I changed the name of the file by adding "-1.3" it suddenly started working.

It should be sites/all/libraries/maskedinput/jquery.maskedinput-1.3.js

Sample blackbox block

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas non porta odio, id mattis erat.

Nam sed tincidunt eros. Donec a venenatis odio, vitae commodo sem. Vivamus ullamcorper pellentesque erat, in adipiscing tortor scelerisque sit amet. Nulla pulvinar urna magna. Vivamus a ipsum lorem. Etiam adipiscing pulvinar lorem.