TreeGrid v6.0
Button type
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.
<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.
<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);’/>
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.
On click to button is displayed popup menu and user uses one action to be done.
Default icon setting is Icon=”Popup” IconAlign=”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.
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).
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=”4” NoUpload=”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=”0” NoUpload=”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=”-1” NoUpload=”1”
cellType=”Button” cellButton=”Tab” cellRadio=”1”