Text that is to be appended to all affected fields, such as to describe the presence or purpose of the keypad.
A function that is called after the keypad is constructed but before it is displayed, allowing you to update it. For example, you could add extra buttons that perform tasks outside the scope of the normal keypad.
The function receives the division to be displayed and the keypad instance object as parameters, while this
refers to the text field.
$(selector).keypad({
beforeShow: function(div, inst) {
$("<button id=\"clickMe\" class=\"keypad-key\">Click me</button>")
.appendTo(div)
.click(function() {
alert("Clicked");
});
}
});
The URL of an image to use for the trigger button.
Set to true to indicate that the trigger image should appear by itself and not on a button.
Control the speed of the show/hide animation with this setting: slow, normal, fast, or a number of
milliseconds.
One popup keypad is shared by all instances, so this setting allows you to apply different CSS styling by adding an extra class to the keypad for each instance.
Set to true to indicate that only the keypad can be used to enter text, or to false to allow normal
entry as well. This option does not apply to inline keypads.
Set the layout of the keypad by defining the characters present on each row. All alphabetic characters should be in lower case. Make use of the keypad constants to add special features into the layout:
Use the regional settings to set what is shown for each of these buttons.
A function that is called when the keypad is closed.
The function receives the current field value and the keypad instance object as parameters, while this
refers to the text field.
$(selector).keypad({
onClose: function(value, inst) {
alert("Closed with value " + value);
}
});
A function that is called when a key is pressed on the keypad.
The function receives the current key value ($.keypad.BS for the Back key, $.keypad.DEL for the Clear key,
and the empty string for other control keys), the full field value, and the keypad instance object as
parameters, while this refers to the text field.
Of course, you can still have an onchange handler for the input field itself.
$(selector).keypad({
onKeypress: function(key, value, inst) {
$("#keypress").text(key || " ");
$("#current").text(value);
}
});
Text that is displayed at the top of the keypad. The value may include HTML markup.
Set to true to indicate that all characters in the layout should be randomised for each display. When
true, this setting overrides the other randomized settings.
Set to true to indicate that the alphabetic characters in the layout should be randomised for each display.
The isAlphabetic setting determines which characters are alphabetic.
Set to true to indicate that the numeric characters in the layout should be randomised for each display. The
isNumeric setting determines which characters are numeric.
Set to true to indicate that the non-alphanumeric characters in the layout should be randomised for each
display.
The character that separates the text content of the keys, used in conjunction with the layout setting.
By default it is blank, so each key contains only one character.
$(selector).keypad({
separator: "|",
layout: [
"ACT|NSW|NT",
"QLD|SA|TAS",
"VIC|WA"
]
});
Set which animation is used to display the keypad. Choose from three standard animations show, fadeIn, or
slideDown; or use one of the jQuery UI effects if you include that package. For no animation use the empty
string.
Control when the keypad is displayed:
focus for only on focus of the text fieldbutton for only on clicking the trigger buttonboth for both focus and buttonIf you use one of the jQuery UI effects for the animation above, you can supply additional options for that effect via this setting:
$(selector).keypad({
showAnim: "clip",
showOptions: {
direction: "horizontal"
}
});
When using an inline keypad you can set this field to an input field to have the keypad update it automatically. The value can be either the element itself, a jQuery wrapper around the element, or the jQuery selector for it.
When not given, uses the onKeypress callback instead.
Set to true to add ThemeRoller classes to the keypad to allow the keypad to integrate with other UI
components using a theme.
Generated using TypeDoc
Optional settings that can be passed when creating a new keypad instance to customize its behavior.