Button

Description

The ButtonElementWdg is an icon that behaves as a button which must be placed inside a TableLayoutWdg. This widget allows you to add a simple button with in a table that when pressed, will execute a JavaScript callback. This callback can be inline to the element definition or it can point to a script code or script path in the Script Editor ( "custom_scripts" table).

Info

Name

Button

Class

tactic.ui.table.ButtonElementWdg

Category

Button

Supported Interfaces

TableLayoutWdg

TACTIC Version Support

3.0 +

Required database columns

none

Usage

The usage of the button widget is very simple. It appears as an icon in the cell of a table. Hovering over it will light the color and if a "tool_tip" is defined, then this message will appear. Clicking on the button will activate the callback and perform whatever action has been set up for this button.

Implementation

The button widget is often implemented through the view options when creating/editing a column.

Options

icon

The icon to display for the button. See IconWdg for reference.

script

Points to the script code that is executed when the button is clicked

path

Points to the folder/script_name of the config/custom_script that is to be executed when the button is clicked (This is recommended option)
icon_tip Text to display as a tool-tip when mouse is hovering over icon

enable

Expression to determine whether the button is enabled or not
cbjs_action Inline script

Advanced

Simple inline alert using default icons.

<element name='my_button' title='My Button Example'>
  <display class='tactic.ui.table.ButtonElementWdg'>
    <cbjs_action>alert('Pressed')</cbjs_action>
  </display>
</element>

Add a custom icon listed in IconWdg

<element name='my_button' title='My Button Example'>
  <display class='tactic.ui.table.ButtonElementWdg'>
    <icon>FILM</icon>
    <cbjs_action>alert('Pressed')</cbjs_action>
  </display>
</element>

A more complex inline code using CDATA

<element name='my_button' title='My Button Example'>
  <display class='tactic.ui.table.ButtonElementWdg'>
    <icon>FILM</icon>
    <cbjs_action>
<![CDATA[
if ( confirm("Are you sure you want to press") ){
    alert("do something...")
}
]]>
    </cbjs_action>
  </display>
</element>

This will call the custom_script with the folder "test" and title "my_test_script". Inlining long JavaScript can be messy and this provides a means of separating out the behavior logic from the configuration. The script that is called will have a bvr object available to it. This behavior object will have a number of attributes which are useful for extracting information about the button that was pressed.

<element name='my_button' title='My Button Example'>
  <display class='tactic.ui.table.ButtonElementWdg'>
    <icon>FILM</icon>
    <path>test/my_test_script</path>
  </display>
</element>