Default Input Mode

Using WCSS, it is possible to limit the type of content that can be entered into an input field on a mobile/cell phone by defining the input mask or input mode using the CSS property -wap-input-format. When the user goes to enter information into a input field, their mobile phone will require the character mode you specify.

This article discusses those modes and how to use them.
The property -wap-input-format can have many different format characters, for which you can build an input mask:

Below are some examples:

• Limit the input to only numeric characters (any length):

  <input type="text" style='-wap-input-format: "*N"' />

• Limit the input to force 4 numeric characters (the input has to be 4 numeric characters - e.g. not 1, 2, 3 or 5):

  <input type="text" style='-wap-input-format: "NNNN"' />

• Limit the input to a maximum of 4 numeric characters (e.g. It can be 1, 2, 3 or 4):

  <input type="text" style='-wap-input-format: "4N"' />

• Limit the input to alpha characters by capitalizing the first letter:

  <input type="text" style='-wap-input-format: "A*a"' />

Please note: The input mask must be enclosed in double quotes since the -wap-input-format property takes a string value and single quotes do not work in Openwave Mobile Browser 6.2.2. For example,

<input type="text" style="-wap-input-format: 'N'"/>

Instead, you need to change to the following markup so that the input mask is enclosed in double quotes:

<input type="text" style='-wap-input-format: "N"'/>

Tags: -wap-input-format, Default input mode, Mobile, WAP, WCSS