TreeGrid v6.0

Button type

TreeGrid documentation index

 

Button type can display various action button types:

clickable button              Clickable button, after click there is called predefined action

switch button                  Button with two states on / off. After click it switches to the other state and is called predefined action

radio / tab button           Group of switch buttons – after click to one button in group the other buttons are automatically switched off

menu button                    After click to button is displayed popup menu and user selects one action from the list.

combo switch button      A user selects button state from its popup menu, for the selected state is called assigned action

combo radio / tab button             A group of combo switch buttons, after change some button state, the other buttons are reset to its predefined empty value.

 

Button type is intended to use especially in Space rows as control or tool buttons or tabs.

In normal non space rows is often better to use Panel type to show one or more clickable buttons in one cell.

 

Basic clickable action button

 

<C> <cell>        string    Type             [“Text”]              Type=”Button”                                                                                                             .

To define Button type, set column or cell attribute Type to “Button”.

The Button Type is default type in Toolbar and Tabber rows.

 

<cell>                string    value                                                                                                                                                              new 6.0 .

Button content

1. HTML code for Button type Html.

2. <BUTTON> caption for Button type Button.

 

<C> <cell>        string    Button       [“Html” / “Tab”]                                                                                                             new 6.0;upd 7.0.

Type of button display. Default is “Html” except for Tabber row that is “Tab”.

Button                Shows HTML <BUTTON>, the button text is specified by ButtonText.

Html                  Any HTML code displayed as is, specified by ButtonText. It can be <button>, <img>, <a> tag or any other HTML code.

                           It can contain also any predefined JavaScript onclick code.

Tab                    Similar to Html, but with different look – visually separated tab page. Can be used only on Space row.

TabSep              No button, tab separator only. Set the space cell Width attribute to the separator size (since 7.0).

                           If the TabSep cell has not set its Width, it has automatically set RelWidth=’1’ and aligns the next cells right side.

 

<C> <I> <cell> string    ButtonWidth   [-1]                                                                                                                                new 6.0 .

Width of < BUTTON > tag for Button=”Button”, in pixels.

 

<C> <cell>        string    Icon                                                                                                                                                                new 6.0 .

Standard left / right side button, see Left side icon.

 

<Space cell>    int          Height                                                                                                                                                          new 7.0 .

Height of the cell in pixels.

Set it when the Icon in Space cell is not visible whole

 

<C> <cell>        bool       Disabled [0]                                                                                                                                new 6.3 .

If the button is disabled.

Disabled button is inactive and is displayed with 30% opacity.

 

<XML event>    void       OnClick    (TGrid Grid, TRow Row, string Col, TEvent Event)                                                              new 6.0 .

Standard column, row, cell or Actions attribute containing JavaScript code.

It is called on click to the cell.

It is standard TreeGrid mouse event, here is just mentioned to not forget its possibility when handling Button clicks.

Example: <I Col1OnClick=’alert(“clicked column ”+Col);’/>

 

<Actions>                      Button ...F                                                                                                                                               new 6.0 .

Provides action for the button

 

<C> <cell>        string    ReloadData                                                                                                                                                         .

Url or data to reload body from here when button is clicked.

It can be direct XML (starting with <) or tag id of existing tag (input) to use its value or URL.

It replaces Data_Url / Data_Tag / Data_Data and reloads body of TreeGrid.

The data must contain only <Body> tag and not layout definition.

If defined List, it contains first character separated list of the data to reload on the specific item click.

 

Switch on / off button

 

<C> <cell>        bool       Switch       [0]                                                                                                                                              new 6.0 .

If set, the button will have two states 0 / 1 and can be switched by click

 

<cell>                bool       value            [0]                                                                                                                                              new 6.0 .

Button value is 0 or “” as off and 1 as on

 

<C> <cell>        string    ButtonText                                                                                                                                             new 6.0 .

1. HTML code for Button type Html.

2. <BUTTON> caption for Button type Button.

 

<C> <cell>        string    ButtonTextChecked                                                                                                                    new 6.0 .

If set, it replaces ButtonText for checked Switch button (button with value > 0)

 

<C> <cell>        string    Icon                                                                                                                                                                new 6.0 .

Standard left / right side button, see Left side icon.

 

<C> <cell>        string    IconChecked                                                                                                                                        new 6.0 .

If set, it replaces Icon for checked Switch button (button with value > 0)

 

<C> <cell>        string    Formula                                                                                                                                                                  .

Standard Formula attribute for Calculated row, here is stated just not forget its advantage for Switch buttons.

The Switch button can have set its Formula to calculate its state.

The formula must return 0 or 1 as button state.

 

<XML event>    void       OnChange          (TGrid Grid, TRow Row, string Col, TEvent Event)                                                 new 6.0 .

Standard column, row, cell or Actions attribute containing JavaScript code.

It is called when the Switch or Radio Button value is changed. For Radio is called also for automatically unchecked buttons.

Attach the action or any JavaScript code to the cell to be run on cell value change, like <I ... Col1OnChange=’alert(“changed!”)’ ... />

The new state can be got by Get(Row,Col).

 

<XML event>    void       OnCheck (TGrid Grid, TRow Row, string Col, TEvent Event)                                                new 6.0 .

Special column, row, cell or Actions attribute containing JavaScript code.

It is called when the Switch or Radio Button value is checked.

Example: <I Col1OnCheck=’alert(“checked cell ”+Col);’/>

 

<XML event>    void       OnUncheck       (TGrid Grid, TRow Row, string Col, TEvent Event)                                                 new 6.0 .

Special column, row, cell or Actions attribute containing JavaScript code.

It is called when the Switch or Radio Button value is unchecked. For Radio is not called for automatically unchecked buttons.

Example: <I Col1OnCheck=’alert(“unchecked cell ”+Col);’/>

 

 

Radio / tab button

A group of Switch buttons, a user switches among them – chooses only one

All other attributes are the same as in Switch button, except the Switch attribute itself.

 

<C> <cell>        int          Radio          [0]                                                                                                                                              new 6.0 .

If set, all the Button cells (in the same row) with the same Radio value will be in one radio group.

It is an index of radio group of Button cells in row.

Only one cell in the group of cells (with the same Radio) can be checked.

When a user checks some Radio button, the previously checked button in the group is automatically unchecked.

 

<C> <cell>        bool       Uncheck [0/1]                                                                                                                             new 6.0 .

If all the buttons with the same Radio can be empty – a user can uncheck the checked button.

 

Button with popup menu

On click to button is displayed popup menu and user uses one action to be done.

Default icon setting is Icon=”PopupIconAlign=”Right”. You can hide the icon by setting Icon=””

 

<C> <cell>        string[*] List                                                                                                                                                                  new 6.0 .

A first character separated list of values to select to the button value. A user can choose one value from combo.

 

Or it can be in standard TreeGrid menu format as complex menu with sub levels, sub menus, columns and so on.

The individual menu items can have set attributes Icon, Action and ReloadData to be used instead of Icons / Actions / ReloadData lists.

 

<C> <cell>        string[*] Icons                                                                                                                                                             new 6.0 .

A first character separated list of icons displayed for individual menu items in List.

For combo button is the chosen menu item icon also set to the button Icon attribute.

 

<C> <cell>        int          IconHeight                                                                                                                                              new 7.0 .

Height in pixels of the icons in Icons.

 

<C> <cell>        string[*] Actions                                                                                                                                                       new 6.0 .

A first character separated list of OnClick actions called after specific item in menu List is clicked.

The action can contain any JavaScript or TreeGrid action like standard XML event, see OnClick.

 

<C> <cell>        string[*] ReloadData                                                                                                                                                         .

A first character separated list of ReloadData urls.

 

API event          void       OnButtonListClick              (TGrid grid, TRow row, string col, string item, int index)                new 6.0 .

Called after some event in Button List menu is clicked.

item is item name from List, index is item position in List or menu item Value if set.

 

Combo switch button

If you set both Switch and List, the button behaves as combo box – a user chooses one button value from the popup menu.

 

All other attributes are the same as in Popup menu button.

 

<C> <cell>        bool       Switch       [0]                                                                                                                                              new 6.0 .

If set, the button will get the value chosen in List.

 

<cell>                string    value                                                                                                                                                              new 6.0 .

Initial Button value or value chosen from List.

 

<C> <cell>        string    Formula                                                                                                                                                                  .

Standard Formula attribute for Calculated row, here is stated just not forget its advantage for Switch buttons.

The Switch button can have set its Formula to calculate its state.

The formula must return the button text to display.

 

<XML event>    void       OnChange          (TGrid Grid, TRow Row, string Col, TEvent Event)                                                 new 6.0 .

Standard column, row, cell or Actions attribute containing JavaScript code.

It is called when the Switch or Radio Button value is changed. For Radio is called also for automatically unchecked buttons.

Attach the action or any JavaScript code to the cell to be run on cell value change, like <I ... Col1OnChange=’alert(“changed!”)’ ... />

The new state can be got by Get(Row,Col).

 

 

Combo radio / tab button

If you set both Radio and List, the button behaves as radio combo box – a user chooses one button value from the popup menu.

A group of Switch buttons, a user switches among them – chooses only one

In the group can be combined the combo and normal Switch buttons.

 

All other attributes are the same as in Combo switch button and Radio tab button, except the Switch attribute itself.

 

<C> <cell>        string    EmptyValue                                                                                                                                           new 6.0 .

The value set to the button text when the button is automatically unchecked, because of checking another button in the radio group.

Remember, its functionality differs from EmptyValue attribute for other cell types.

 

<C> <cell>        string    EmptyIcon                                                                                                                                              new 7.0 .

The icon set to the button Icon attribute when the button is automatically unchecked, because of checking another button in the radio group.

 

<C> <cell>        int          PopupIcon        [1]                                                                                                                                 new 7.0 .

If the right side popup icon will be displayed.

0 – never, 1 – only for EmptyValue, 2 – always.

 

 

Special Space rows with buttons

 

<I>                     string    Kind             Kind=”Toolbar”      (also Toolbar1 and Toolbar2)                                           chg 6.0; upd 7.0.

Special Space row to use especially with Button type cells.

It has predefined some different default settings:

Space=”4NoUpload=”1

cellType=”Button

(since 7.0) The Toolbar1 and Toolbar2 kinds can be used when there are defined two bottom toolbars, just to better style them.

 

Every grid has defined one default Toolbar in Defaults.xml. See Default Toolbar.

 

<I>                     string    Kind             Kind=”Topbar”       (also Topbar1 and Topbar2)                                                           new 7.0 .

Special Space row to use especially with Button type cells.

It has predefined some different default settings:

Space=”0NoUpload=”1

cellType=”Button

The Topbar1 and Topbar2 kinds can be used when there are defined two top toolbars, just to better style them.

 

<I>                     string    Kind             Kind=”Tabber”                                                                                                                  new 6.0 .

Special Space row to use especially with Button Tab type cells.

It has predefined some different default settings:

Space=”-1NoUpload=”1

cellType=”ButtoncellButton=”TabcellRadio=”1