Options
All
  • Public
  • Public/Protected
  • All
Menu

The configuration for the Keyboard widget. You can access this configuration via BaseWidget.cfg. Please note that this configuration is usually meant to be read-only and should not be modified.

Hierarchy

Index

Properties

appendText: string

Text that is to be appended to all affected fields, such as to describe the presence or purpose of the keypad.

beforeShow: BeforeShowListener

Callback that is invoked by the keyboard JQuery plugin before the keyboard is brought up.

behaviors: Record<string, Behavior>

A map with all behaviors that were defined for this widget. The key is the name of the behavior, the value is the callback function that is invoked when the behavior is called.

buttonImage: string

The URL of an image to use for the trigger button.

buttonImageOnly: boolean

Set to true to indicate that the trigger image should appear by itself and not on a button.

duration: number | "slow" | "normal" | "fast"

Control the speed of the show/hide animation with this setting: slow, normal, fast, or a number of milliseconds.

formId?: string

ID of the form to use for AJAX requests.

id: string | string[]

The client-side ID of the widget, with all parent naming containers, such as myForm:myWidget. This is also the ID of the container HTML element for this widget. In case the widget needs multiple container elements (such as Paginator), this may also be an array if IDs.

keypadClass: string

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.

keypadOnly: boolean

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.

layout: string[]

The resolved and parsed keyboard layout to be used. Contains on item for each row, each keyboard row contains the character codes of the keys shown on that row.

layoutName: string

The name of the built-in keyboard layout to use. Mutually exclusive with layoutTemplate.

layoutTemplate: string

An optional custom keyboard layout template specified by the user. The keyboard rows must be separated by a comma. Each row contains the keys that should be displayed on that row. To specify a control button (space, back, shift etc.), separate the name of the control key with a dash.

onClose: CloseListener

Callback that is invoked by the keyboard JQuery plugin before the keyboard is closed.

onKeypress: null | KeypressListener

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);
}
});
since

1.2.0 - added current key parameter.

since

1.2.1 - added $.keypad.BS and $.keypad.DEL characters for Back and Clear keys.

postConstruct: PostConstructCallback

An optional callback that is invoked after this widget was created successfully, at the end of the init method. This is usually specified via the widgetPostConstruct attribute on the JSF component. Note that this is also called during a refresh (AJAX update).

postRefresh: PostRefreshCallback

An optional callback that is invoked after this widget was refreshed after an AJAX update, at the end of the refresh method. This is usually specified via the widgetPostRefresh attribute on the JSF component.

preDestroy: PreDestroyCallback

An optional callback that is invoked before this widget is about to be destroyed, e.g., when the component was removed at the end of an AJAX update. This is called at the beginning of the destroy method. This is usually specified via the widgetPreDestroy attribute on the JSF component.

prompt: string

Text that is displayed at the top of the keypad. The value may include HTML markup.

randomiseAll: boolean

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.

since

1.0.2

randomiseAlphabetic: boolean

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.

randomiseNumeric: boolean

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.

randomiseOther: boolean

Set to true to indicate that the non-alphanumeric characters in the layout should be randomised for each display.

separator: string

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"
]
});
since

1.2.0

showAnim: string

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.

since

1.2.3 - use empty string for no animation.

showOn: "focus" | "button" | "both"

Control when the keypad is displayed:

  • focus for only on focus of the text field
  • button for only on clicking the trigger button
  • both for both focus and button
showOptions: null | Record<string, unknown>

If 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"
}
});
target: null | string | HTMLElement | JQuery<HTMLElement>

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.

since

1.2.1

useThemeRoller: boolean

Set to true to add ThemeRoller classes to the keypad to allow the keypad to integrate with other UI components using a theme.

since

1.3.0

widgetVar: string

The name of the widget variables of this widget. The widget variable can be used to access a widget instance by calling PF("myWidgetVar").

Generated using TypeDoc