Home >

On this page

AX1055

Using buttons in Formatted Grids

You can use the Button content tag within a Grid data source to present an interactive button to users.

The Button tag has no effect within the source file itself, but when the file is viewed as an Axiom form, the Button tag will be resolved as an interactive button. The user can click the button to trigger a form update and optionally perform a designated command.

NOTE: The Button tag is only supported for use in thematic grids. If a Button tag is present in a spreadsheet-formatted grid, it will display as the raw tag text.

Content tag syntax for buttons

The syntax for the Button content tag is as follows:

[Button; Text=LabelText; Tooltip=Text; IsEnabled=True/False; ButtonBehavior=BehaviorName; TargetDialogPanel=ComponentName; TargetFormattedGrid=ComponentName; ButtonStyle=StyleName; ImagePathURL=Path; Symbol=SymbolName; SymbolPosition=Left/Right; SaveOnSubmit=True/False; ConfirmationMessage=MessageText; Command=CommandString; TargetDialogPanel=ComponentName; Columns=Number; ColumnStyle=StyleName]

Parameters can be listed in any order after the Button tag. Optional parameters can be omitted.

To create the tag, you can manually type it within a cell, or you can use the Data Source Assistant / Tag Editor. For more information, see Creating and editing content tags in Formatted Grids.

Parameter Description

Text

The text to display on the button.

You can define the button text within the tag directly, or you can use a bracketed cell reference to read the text from another cell. For more information, see Referencing cells in content tag parameters.

NOTE: The Text parameter does not apply if the ButtonStyle is set to Image. You can also optionally omit the button text if a symbol is specified for the button.

Tooltip

Optional. Specifies tooltip text to display when a user hovers the cursor over the cell contents.

Alternatively, you can use a bracketed cell reference to read the tooltip text from the referenced cell. This approach is useful if you want to dynamically determine the text, because then the formula can be in the referenced cell instead needing to construct the tag using a formula. For more information, see Referencing cells in content tag parameters.

ButtonBehavior

Optional. The button behavior to use for the button.

  • Command (default): Updates the form and can optionally execute a command.
  • ShowDialogPanel: Opens a dialog defined by a designated Dialog Panel component. A command can still be optionally executed when using this behavior.
  • EditGridDatainSpreadsheet: Opens the contents of a specified Formatted Grid component in a spreadsheet-style editor.

These button behaviors are the only behaviors currently supported by the Button tag. The other button behaviors that are available for the Button component cannot be used by the Button tag. For more information on button behaviors, see Button behaviors.

TargetDialogPanel

The name of the Dialog Panel component to open when the button is clicked. This parameter only applies when using the ShowDialogPanel button behavior.

For more information on using Dialog Panel components, see Dialog Panel component for Axiom forms.

TargetFormattedGrid

The name of the Formatted Grid component to open in the spreadsheet editor when the button is clicked.

This parameter only applies when using the EditGridDatainSpreadsheet button behavior.

For more information on using the spreadsheet editor, see Editing grid contents in a spreadsheet editor.

SaveOnSubmit

Optional. Specifies whether a save-to-database occurs when a form update is triggered by this button. This parameter only applies when the button behavior is Command.

By default this parameter is False, which means no save-to-database will occur. If this parameter is set to True, then a save-to-database will occur as part of the update process. This save occurs after editable values have been submitted to the source file and after data has been refreshed in the source file. The file must be configured to enable a save-to-database process. For more information, see Saving data from an Axiom form.

IsEnabled

Optional. Specifies whether the button is enabled. If omitted or True, the button is active. If False, the button is grayed out and inactive.

Generally speaking, the only reason not to use True is if you are dynamically enabling and disabling the button based on some other factor. For example, you may be checking to make sure that all required inputs have been made before enabling the button. In this case, you must construct the tag using a formula so that you can change the value of this parameter.

ButtonStyle

The style of button. Specify one of the following:

  • Push (default): The button displays as a standard rectangular button. The user clicks the button to perform the button action.

  • Link: The button displays as if it is a hyperlink. The user clicks the link to perform the button action. The button text defines the hyperlink text.

  • Image: The button displays as an image. The user clicks on the image to perform the button action. When using this option, you must specify either an image file or a symbol to use as the button image.

Button tags support the same button styles as the Button component. For more information and examples of the different button styles, see Using different button styles.

ImagePathURL

The image to display for the button. This parameter only applies when ButtonStyle is set to Image.

Specify the full path to the image in the Axiom file system, for example:

\Axiom\Reports Library\Images\axiom_logo.png

You can define the path within the tag directly, or you can use a bracketed cell reference to read the path from another cell. For more information, see Referencing cells in content tag parameters.

NOTES:  

  • If the image is later moved or renamed, you must edit the tag to specify the new name or location, otherwise the image reference will be broken. This path does not automatically update.

  • Users must have permission to the image file in order to see it rendered in the form. It is recommended to create a dedicated Images folder in the Reports Library and store all images in this location. You can grant access to this folder using the Everyone role, or you can create subfolders and grant access to users and roles as needed.

  • You can specify either an image path or a symbol for the image button. If you specify a symbol, then the Image Path fields are hidden in the Tag Editor / Data Source Assistant. If you originally specified a symbol but now you want to specify an image path, you must first clear the symbol in order to make the Image Path fields available again.

Symbol

Optional. The symbol to use for the button. The symbol applies as follows:

  • For push and link buttons, the selected symbol displays on the button in addition to the button text. You can also optionally omit the text when a symbol is specified.

  • For image buttons, you can optionally use a symbol for the button image instead of specifying an image file.

In the Tag Editor / Data Source Assistant, click the [...] button to open the Choose Symbol dialog. Within this dialog, you can scroll through the available symbols, or you can use the filter box at the top to find symbols based on symbol names. For example, you can type file to see all of the symbols that have the word "file" in the name.

When you have found the symbol that you want to use, select it and then click OK. The selected symbol shows in the Tag Editor / Data Source Assistant, and the actual symbol name is written to the Button tag.

Alternatively, you can use a bracketed cell reference to read the symbol name from another cell. For more information, see Referencing cells in content tag parameters.

NOTE: If you select an image path for an image button, then the Symbol fields are hidden. If you originally selected an image path but now you want to select a symbol, you must first clear the selected image path in order to make the Symbol fields available again. (If you specify both an image path and a symbol by manually editing the Button tag, the symbol takes precedence.)

SymbolPosition

The position of the symbol relative to the button text (Left/Right). Left is the default position. This parameter only applies to push and link buttons, and only if a symbol is specified for the button.

ConfirmationMessage

Optional. Defines a confirmation message to display before performing any button actions. This parameter only applies when the button behavior is Command.

If a confirmation message is defined, then when a user clicks the button in the Axiom form, a message box will display the message. The user can click OK to proceed with the button actions, or click Cancel to abort the form update and any assigned command.

You can define the message within the tag directly, or you can use a bracketed cell reference to read the message from another cell. For more information, see Referencing cells in content tag parameters.

Command

Optional. Specifies one or more commands to perform when the button is clicked. The same commands that are available for the Button component can also be used here. For more information, see Using buttons to perform commands.

The command to execute and its parameters must be placed in a valid command string. This string looks something like the following:

command://ProcessActionCodesCommandAdapter?sheet=Sheet2&tag=Action&_ps=AfterUpdateValues

However, it is not recommended to manually create your own command string. Instead, you should use the Tag Editor dialog or the Data Source Assistant to select the desired command and define the parameters, and then it will create the string for you.

You can optionally define multiple commands. When using the editor, click Add to add another command. Multiple commands are added as comma-separated strings to the Command parameter.

You can define the command within the tag directly, or you can use a bracketed cell reference to read the command from another cell. For more information, see Referencing cells in content tag parameters. Note that if you use a cell reference, each cell must contain a single command. If you want to use multiple commands, you must use multiple cell references separated by commas (or a command string plus a cell reference). For example: Command=[MySheet!A1],[MySheet!A2]

Columns

Optional. Specifies how many columns the cell contents will span in the grid.

If this parameter is omitted or set to 1, then content generated by the tag will only span the current column. If you want the content to span multiple columns, enter a number such as 2 to span 2 columns. The column span extends to the right.

NOTE: The row and column styles used in the grid impact how the column span displays. For example, if the content in the starting column is left-aligned and does not naturally exceed the width of the starting column, then the spanned columns will simply be blank because no content is extending to those columns. However, if the content is long enough to extend out of the starting column, or if the content has external borders (such as a text box), or if the content is center-aligned or right-aligned, then content will display in the spanned columns.

ColumnStyle

Optional. Specifies one or more column styles to apply to the current cell. The specified styles override the current column styles set by the [ColumnStyle] tag, but only for the current cell contents (including the column span, if defined). The next cell down will not inherit the styles specified for this cell; the next cell will revert to using the currently applied column styles.

Enter one or more valid column style names, separated by commas. If you are using the Data Source Assistant / Tag Editor, you can click the [...] button to open the Choose Styles dialog and select from available styles. The available styles depend on the skin specified for the form. For more information, see Using row and column styles in a thematic grid.

Alternatively, you can use a bracketed cell reference to read the style from the referenced cell. This approach is useful if you want to dynamically determine the style, because then the formula can be in the referenced cell instead needing to construct the tag using a formula. For more information, see Referencing cells in content tag parameters.

Button behavior notes

  • Push buttons will either extend to fill the column width or auto-size based on the button text, depending on the button width property of the assigned style. For example, the col style will cause the button to fill the column width, while the auto-width style causes the button to auto-size.

  • Link buttons are treated as hyperlink text for sizing and positioning purposes. The text-align property defined for buttons is ignored; instead the general text-align property applies. For example, apply a style that includes centered text positioning if you want the text to be centered in the column.

    By default, the hyperlink text is in blue font and without an underline. If desired, you can use the following column styles to change the display:

    • text-color: Removes the blue color and instead displays in the default text color.
    • underlined: Applies an underline to the text.
  • If you are using an image button with an image file, you should apply the fit-height column style (or another style with button height at 100%). This will cause the image to scale to fit the row height, while maintaining the size ratio of the image.

  • Grid buttons and the Apply Form State command cannot be used in a refresh form (meaning when an Axiom form serves as the refresh dialog in the Desktop Client). In this use case, the Apply Form State command must be combined with the Close Dialog command in order to trigger the refresh behavior. Because Button tags can only use a single command, a stand-alone Button component must be used instead. For more information, see Using an Axiom form as a refresh form.

Examples

[Button; Text=Refresh; ButtonBehavior=Command; ButtonStyle=Push]

This example is a basic button that triggers a form update.

[Button; Text=Action codes; ButtonBehavior=Command; ButtonStyle=Link; Command=command://ProcessActionCodesCommandAdapter?sheet=Sheet2&tag=Action&_ps=AfterUpdateValues]

This example executes the Process Action Codes command in addition to the normal form update. The button style is Link so the button will display as link text instead of as a push button.

[Button; ColumnStyle=fit-height; ButtonBehavior=Command; ButtonStyle=Image; ImagePathUrl=\Axiom\SystemFolderName_ReportsLibrary\Images\new_axiom_logo.png]

This example displays as an image button using the specified image. A style is applied at the tag level so that the image will be auto-sized to fit the current cell.

[Button; Text=Save; ButtonBehavior=Command; SaveOnSubmit=True; ButtonStyle=Push; ConfirmationMessage=Are you sure you want to save this data?]

This example triggers a save-to-database in addition to the normal form update. The defined confirmation message will display before any action is taken, to give the user a chance to cancel if desired.

[Button; Text=Save; ButtonBehavior=Command; SaveOnSubmit=True; ButtonStyle=Push; Symbol=fa-save; SymbolPosition=Right;]

This example displays a symbol on the button in addition to the text. The symbol displays to the right of the text.

[Button; Text=Add Row; ButtonBehavior=ShowDialogPanel; TargetDialogPanel=AddRowDialog; ButtonStyle=Push;]

This example uses the ShowDialogPanel behavior to open a specified Dialog Panel component as a dialog.

[Button; ButtonBehavior=Command; Text=OK; ButtonStyle=Push; Command=command://ApplyFormStateCommandAdapter?refreshMode=Worksheet, command://CloseDialogCommandAdapter;]

This example can be used in a form dialog to apply form state to the active client spreadsheet and then close the dialog.