axButton
Description
axButton allows a push button to be inserted into the 5250 screen.
Usability
|
Context |
Supported |
|---|---|
|
Input screen fields |
No |
|
Output screen fields |
Yes |
|
Input subfile fields |
No |
|
Output subfile fields |
No |
|
New screen elements |
Yes |
Properties
|
Name |
Description and Comments |
JavaScript |
Shipped default |
|---|---|---|---|
|
buttonType |
The type of Material Design button to apply. The values are text, raised, unelevated, outlined, and dense. For Material Design theme only. |
No |
unelevated |
|
caption |
Specifies the text that is to appear on the button. |
Yes. Must return a string. |
None |
|
enabled |
Indicates whether this element is enabled. TS2 only. |
Yes. Must return a Boolean. |
True |
|
hidden |
Indicates whether this button is hidden or visible. |
Yes. Must return a Boolean. |
False |
|
icon |
The name of icon to display on the button. For Material Design theme only. |
Yes. Must return a string. |
None |
|
onClick |
Optional. JavaScript code to be executed when the user clicks on the button. |
Yes |
SENDKEY(ENV.defaultKey); |
|
onFocus |
Optional. JavaScript code to be executed when the element receives the focus. |
Yes |
None |
|
onBlur |
Optional. JavaScript code to be executed when the element lost the focus. |
Yes |
None |
|
style |
Additional style properties that should be applied to the button. |
Yes. Must return a valid style object. |
None |
|
sizeToField |
Indicates whether this button should be sized to fill its containing field or automatically sized to match its content. |
Yes |
True |
|
tooltip |
The tool tip (or hint) that should appear when the user hovers the mouse over this button. |
Yes. Must return a string. |
None |
Notes, Comments and Warnings
In Application, appStylesTheme = JQueryUI
When JQueryUI is selected from Application->Styling->appStylesTheme property, the display will change according to the theme that was set in the Application’s jqueryTheme property.
Basic display:
When JQueryUI theme is selected:
Hovering on the button will also change its styles.
In Application, appStylesTheme = Material Design
When Material Design is selected from Application->Styling->appStylesTheme property, the display will change according to the theme that was set in the Application’s mdTheme property.
When buttonType property is set to unelevated (default):
When buttonType property is set to text:
when hovered:
When buttonType property is set to raised:
when hovered:
When buttonType property is set to outlined:
when hovered:
When buttonType property is set to dense:
when hovered:
When icon property is set to save:
Examples
(1). On the System i Main Menu, with the command input field named Commandline, if this push button is added to the display:
with this onClick code:
FIELDS("CommandLine").setValue("WRKOUTQ QPRINT");
SENDKEY("Enter");
then clicking on the button will cause the output queue QPRINT to be displayed.
(2). On the System i Main Menu turn the function key strings Fn=xxxx into buttons:
Click on F3=Exit to select it.
In the extensions list, select Push Button and F3=Exit should turn into a button with a caption of Exit:
Size the button as required and repeat for other desired function keys:
See Also
Using Screen Customization to Add Value
Using Scripting in Properties to Add Value
Push Buttons in Tutorial 6 - Advanced Screen Enhancement
Using Multilingual Captions on Buttons (and other places) in Tutorial 6 - Advanced Screen Enhancement
Using alert()
Application Style Collection for Application themes