You are here

README.txt in Masked Input 8

Same filename and directory in other branches
  1. 7.2 README.txt
CONTENTS OF THIS FILE
---------------------

 * Introduction
 * Installation
 * Usage
 * Advanced


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
------------

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 'Add a new field' select Text (Fromatted) or Text (Fromatted,long).
3) In the Label type "Phone number".
4) Click Save and continue.
5) On the next page, accept the default field length, and click Save.
6) After you get message "Saved phone number configuration." then click on "Manage form display"
7) Go the Phone number field and select "masked_input" in Widget select dropdown
8) Then click on settings icon in same row.
9) In the Mask field, type
         (999) 999-9999
8) clik update
9) Then Save settings

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/masked_input).

File

README.txt
View source
  1. CONTENTS OF THIS FILE
  2. ---------------------
  3. * Introduction
  4. * Installation
  5. * Usage
  6. * Advanced
  7. INTRODUCTION
  8. ------------
  9. Sometimes you need the user to input data in a particular format like a Social
  10. Security Number or a standard US phone number. By masking input of a particular
  11. textbox, you can change its behavior so that it accepts input only according to
  12. specified format, e.g. a masked phone number input box will only allow 10 digits of
  13. of the phone number to pass through and won’t accept any other input.
  14. The Masked Input module is a wrapper for the Masked Input jQuery Plugin by Josh Bush,
  15. http://digitalbush.com/projects/masked-input-plugin. It allows a user to more easily
  16. enter fixed width input where you would like them to enter the data in a certain
  17. format (dates, phone numbers, etc).
  18. INSTALLATION
  19. ------------
  20. Enable the modules from the Administration >> Modules page.
  21. USAGE
  22. -----
  23. The Masked Input module is used in Content Type design when adding a Text field. From the
  24. Widget selection, choose Masked Input and click Save. After defining the maximum length and saving
  25. again, you will arrive at a page for more detail on your new field. Define the mask in the Mask
  26. field.
  27. Example: Go to the Manage Fields form for Basic Page (Or create a new content type, and go to Manage
  28. Fields).
  29. 1) Add a new field called Phone Number.
  30. 2) From the Select 'Add a new field' select Text (Fromatted) or Text (Fromatted,long).
  31. 3) In the Label type "Phone number".
  32. 4) Click Save and continue.
  33. 5) On the next page, accept the default field length, and click Save.
  34. 6) After you get message "Saved phone number configuration." then click on "Manage form display"
  35. 7) Go the Phone number field and select "masked_input" in Widget select dropdown
  36. 8) Then click on settings icon in same row.
  37. 9) In the Mask field, type
  38. (999) 999-9999
  39. 8) clik update
  40. 9) Then Save settings
  41. When you create a new node of type you created or altered, the Phone Number field will have the following:
  42. (___) ___-____
  43. The field will only accept three numerals inside the parentheses, three numerals before the dash,
  44. and four numerals after the dash. It will not accept letters, only numbers. That is because of the
  45. mask we created in step (7).
  46. ADVANCED
  47. --------
  48. You can create new Mask Defenitions at Administration » Configuration » User interface » Masked Input
  49. (admin/config/masked_input).