Mootools Meiomask Plugin Integration

Overview

(from http://www.meiocodigo.com/projects/moomeiomask/)

• Accepts paste event;
• Haves fixed, reverse (currency) and repeat mask types;
• You can still use your hot keys and others (ex: ctrl+t, ctrl+f5, TAB …);
• Supports metadata plugin;
• Works with iPhone;
• Allow default values;
• Haves callbacks for invalid inputs, valid and overflow;
• Haves function to mask strings;
• Support for positive and negative numbers on reverse masks;
• Can auto-focus the next form element when the current input is completely filled.

Take a look at a simple HTML:

<fieldset>
   <label>fixed.phone Mask:</label>
   <input style="width: 200px" type="text" wicket:id="fixedPhone" />
</fieldset>
<fieldset>
   <label>fixed.date Mask:</label>
   <input style="width: 200px" type="text" wicket:id="fixedDate" />
</fieldset>
<fieldset>
   <label>fixed.time Mask:</label>
   <input style="width: 200px" type="text" wicket:id="fixedTime" />
</fieldset>
<fieldset>
   <label>fixed.cc Mask:</label>
   <input style="width: 200px" type="text" wicket:id="fixedCc" />
</fieldset>

Java Code:

form.add(new MeioMaskField<String>("fixedPhone", MaskType.FixedPhone));
form.add(new MeioMaskField<Date>("fixedDate", MaskType.FixedDate));
form.add(new MeioMaskField<Time>("fixedTime", MaskType.FixedTime));
form.add(new MeioMaskField<String>("fixedCc", MaskType.FixedCc));

The output look'n feel is exactly the same as in http://jsfiddle.net/fabiomcosta/8TFvp/1/