Child pages
  • JSTab

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migration of unmigrated content due to installation of a new plugin
{div:style=}
Wiki Markup
Div
styledisplay:none

DO

NOT

EDIT

THE

CONTENT

OF

THIS

PAGE

DIRECTLY

(EXCEPT

INSIDE

THE

DIV

BELOW

WITH

ID=DESCRIPTION),

UNLESS

YOU

KNOW

WHAT

YOU'RE

DOING.


THE

STRUCTURE

OF

THE

CONTENT

IS

VITAL

IN

BEING

ABLE

TO

AUTO

UPDATE

THE

CONTENT

THROUGH

THE

DOC

GENERATOR.

\\ \\ Enter additional information related to this



Enter additional information related to this 'class'

inside

the

\

{div}

macro

with

'id=description'

{div} {div:id=description}{div}\\ {table:id=|class=servoy sSummary}{colgroup}{column:width=80px|padding=0px}{column}{column}{column}{colgroup}{tr:style=height: 30px;}{th:colspan=2}Property Summary{th}{tr}{tbody}{tr}{td}[JSForm]{td}{td}[#containsForm] The name of the form displayed in the tab.{td}{tr}{tbody}{tbody}{tr}{td}[String]{td}{td}[#foreground] The foreground color of the tab.{td}{tr}{tbody}{tbody}{tr}{td}[JSMedia]{td}{td}[#imageMedia] The name of the image Media file used.{td}{tr}{tbody}{tbody}{tr}{td}[String]{td}{td}[#mnemonic] Mnemonic used to switch to tab.{td}{tr}{tbody}{tbody}{tr}{td}[String]{td}{td}[#name] The name of the tab.{td}{tr}{tbody}{tbody}{tr}{td}[String]{td}{td}[#relationName] The name of the relation that links the form which contains the tab with the form displayed in the tab.{td}{tr}{tbody}{tbody}{tr}{td}[String]{td}{td}[#text] The text on the tab.{td}{tr}{tbody}{tbody}{tr}{td}[String]{td}{td}[#toolTipText] The text displayed when hovering over the component with a mouse cursor.{td}{tr}{tbody}{tbody}{tr}{td}[Number]{td}{td}[#x] The X coordinate of the tab.{td}{tr}{tbody}{tbody}{tr}{td}[Number]{td}{td}[#y] The Y coordinate of the tab.{td}{tr}{tbody}{table}\\ {table:id=|class=servoy sSummary}{colgroup}{column:width=80px|padding=0px}{column}{column}{column}{colgroup}{tr:style=height: 30px;}{th:colspan=2}Method Summary{th}{tr}{tbody}{tr}{td}[UUID]{td}{td}[#getUUID]\() Returns the UUID of this component.{td}{tr}{tbody}{table}\\ {table:id=property|class=servoy sDetail}{colgroup}{column:width=100%|padding=0px}{column}{colgroup}{tr:style=height: 30px;}{th:colspan=1}Property Details{th}{tr}{tbody:id=containsForm}{tr:id=name}{td}h6.containsForm{td}{tr}{tr:id=des}{td}{div:class=sIndent}The name of the form displayed in the tab.{div}{td}{tr}{tr:id=ret}{td}*Returns*\\{div:class=sIndent}[JSForm]{div}{td}{tr}{tr:id=sam}{td}*Sample*\\{div:class=sIndent}{code:language=javascript}

Div
iddescription


HTML Table
id
classservoy sSummary
Colgroup Tag
Column
padding0px
width80px

Column

Table Row (tr)
styleheight: 30px;
Table Head (th)
colspan2
Property Summary
Table Body (tbody)
Table Row (tr)
Table Cell (td)
JSForm
Table Cell (td)
#containsForm
The name of the form displayed in the tab.
Table Body (tbody)
Table Row (tr)
Table Cell (td)
String
Table Cell (td)
#foreground
The foreground color of the tab.
Table Body (tbody)
Table Row (tr)
Table Cell (td)
JSMedia
Table Cell (td)
#imageMedia
The name of the image Media file used.
Table Body (tbody)
Table Row (tr)
Table Cell (td)
String
Table Cell (td)
#mnemonic
Mnemonic used to switch to tab.
Table Body (tbody)
Table Row (tr)
Table Cell (td)
String
Table Cell (td)
#name
The name of the tab.
Table Body (tbody)
Table Row (tr)
Table Cell (td)
String
Table Cell (td)
#relationName
The name of the relation that links the form which contains the tab
with the form displayed in the tab.
Table Body (tbody)
Table Row (tr)
Table Cell (td)
String
Table Cell (td)
#text
The text on the tab.
Table Body (tbody)
Table Row (tr)
Table Cell (td)
String
Table Cell (td)
#toolTipText
The text displayed when hovering over the component with a mouse cursor.
Table Body (tbody)
Table Row (tr)
Table Cell (td)
Number
Table Cell (td)
#x
The X coordinate of the tab.
Table Body (tbody)
Table Row (tr)
Table Cell (td)
Number
Table Cell (td)
#y
The Y coordinate of the tab.

HTML Table
id
classservoy sSummary
Colgroup Tag
Column
padding0px
width80px

Column

Table Row (tr)
styleheight: 30px;
Table Head (th)
colspan2
Method Summary
Table Body (tbody)
Table Row (tr)
Table Cell (td)
UUID
Table Cell (td)
#getUUID()
Returns the UUID of this component.

HTML Table
idproperty
classservoy sDetail
Colgroup Tag
Column
padding0px
width100%

Table Row (tr)
styleheight: 30px;
Table Head (th)
colspan1
Property Details
Table Body (tbody)
idcontainsForm
Table Row (tr)
idname
Table Cell (td)
containsForm
Table Row (tr)
iddes
Table Cell (td)
Div
classsIndent
The name of the form displayed in the tab.
Table Row (tr)
idret
Table Cell (td)
Returns
Div
classsIndent
JSForm
Table Row (tr)
idsam
Table Cell (td)
Sample
Div
classsIndent
Code Block
languagejavascript

var childForm = solutionModel.newForm('childForm', 'db:/example_data/child_table', null, false, 400, 300);
var anotherChildForm = solutionModel.newForm('anotherChildForm', 'db:/example_data/child_table', null, false, 400, 300);
var firstTab = tabs.newTab('firstTab', 'Child Form', childForm, relation);
firstTab.containsForm = anotherChildForm;

...

Table Row (tr)
classlastDetailRow
Table Cell (td)

Table Body (tbody)
idforeground
Table Row (tr)
idname
Table Cell (td)
foreground
Table Row (tr)
iddes
Table Cell (td)
Div
classsIndent
The foreground color of the tab.
Table Row (tr)
idret
Table Cell (td)
Returns
Div
classsIndent
String
Table Row (tr)
idsam
Table Cell (td)
Sample
Div
classsIndent
Code Block
languagejavascript

var firstTab = tabs.newTab('firstTab', 'Child Form', childForm, relation);
firstTab.foreground = '#FF0000';

...

Table Row (tr)
classlastDetailRow
Table Cell (td)

Table Body (tbody)
idimageMedia
Table Row (tr)
idname
Table Cell (td)
imageMedia
Table Row (tr)
iddes
Table Cell (td)
Div
classsIndent
The name of the image Media file used.
Table Row (tr)
idret
Table Cell (td)
Returns
Div
classsIndent
JSMedia
Table Row (tr)
idsam
Table Cell (td)
Sample
Div
classsIndent
Code Block
languagejavascript

var bytes = plugins.file.readFile('d:/ball.jpg');
var ballImage = solutionModel.newMedia('ball.jpg', bytes);
var firstTab = tabs.newTab('firstTab', 'Child Form', childForm, relation);
firstTab.imageMedia = ballImage;

...

Table Row (tr)
classlastDetailRow
Table Cell (td)

Table Body (tbody)
idmnemonic
Table Row (tr)
idname
Table Cell (td)
mnemonic
Table Row (tr)
iddes
Table Cell (td)
Div
classsIndent
Mnemonic used to switch to tab.
Table Row (tr)
idret
Table Cell (td)
Returns
Div
classsIndent
String
Table Row (tr)
idsam
Table Cell (td)
Sample
Div
classsIndent
Code Block
languagejavascript

var childForm = solutionModel.newForm('childForm', 'db:/example_data/child_table', null, false, 400, 300);
var anotherChildForm = solutionModel.newForm('anotherChildForm', 'db:/example_data/child_table', null, false, 400, 300);
var firstTab = tabs.newTab('firstTab', 'Child Form', childForm, relation);
firstTab.mnemonic = 'a';

...

Table Row (tr)
classlastDetailRow
Table Cell (td)

Table Body (tbody)
idname
Table Row (tr)
idname
Table Cell (td)
name
Table Row (tr)
iddes
Table Cell (td)
Div
classsIndent
The name of the tab.
Table Row (tr)
idret
Table Cell (td)
Returns
Div
classsIndent
String
Table Row (tr)
idsam
Table Cell (td)
Sample
Div
classsIndent
Code Block
languagejavascript

var firstTab = tabs.newTab('firstTab', 'Child Form', childForm, relation);
firstTab.name = 'firstTabRenamed';

...

Table Row (tr)
classlastDetailRow
Table Cell (td)

Table Body (tbody)
idrelationName
Table Row (tr)
idname
Table Cell (td)
relationName
Table Row (tr)
iddes
Table Cell (td)
Div
classsIndent
The name of the relation that links the form which contains the tab
with the form displayed in the tab.
Table Row (tr)
idret
Table Cell (td)
Returns
Div
classsIndent
String
Table Row (tr)
idsam
Table Cell (td)
Sample
Div
classsIndent
Code Block
languagejavascript

var firstTab = tabs.newTab('firstTab', 'Child Form', childForm);
firstTab.relationName = 'parent_table_to_child_table';

...

Table Row (tr)
classlastDetailRow
Table Cell (td)

Table Body (tbody)
idtext
Table Row (tr)
idname
Table Cell (td)
text
Table Row (tr)
iddes
Table Cell (td)
Div
classsIndent
The text on the tab.
Table Row (tr)
idret
Table Cell (td)
Returns
Div
classsIndent
String
Table Row (tr)
idsam
Table Cell (td)
Sample
Div
classsIndent
Code Block
languagejavascript

var firstTab = tabs.newTab('firstTab', 'Child Form', childForm, relation);
firstTab.text = 'Better Title';

...

Table Row (tr)
classlastDetailRow
Table Cell (td)

Table Body (tbody)
idtoolTipText
Table Row (tr)
idname
Table Cell (td)
toolTipText
Table Row (tr)
iddes
Table Cell (td)
Div
classsIndent

The text displayed when hovering over the component with a mouse cursor.

NOTE:
HTML should be used for multi-line tooltips; you can also use any
valid HTML tags to format tooltip text. For example:
<html>This includes<b>bolded text</b> and
<font color='blue'>BLUE</font>

...

text

...

as

...

well.</html>

...

Table Row (tr)
idret
Table Cell (td)
Returns
Div
classsIndent
String
Table Row (tr)
idsam
Table Cell (td)
Sample
Div
classsIndent
Code Block
languagejavascript

var firstTab = tabs.newTab('firstTab', 'Child Form', childForm, relation);
firstTab.toolTipText = 'Tooltip';

...

Table Row (tr)
classlastDetailRow
Table Cell (td)

Table Body (tbody)
idx
Table Row (tr)
idname
Table Cell (td)
x
Table Row (tr)
iddes
Table Cell (td)
Div
classsIndent
The X coordinate of the tab. This influences the order in which the tabs are displayed.
The tabs are displayed in increasing order of the X coordinate. If two tabs have the
same X coordinate, then they are displayed in increasing order of the Y coordinate.
Table Row (tr)
idret
Table Cell (td)
Returns
Div
classsIndent
Number
Table Row (tr)
idsam
Table Cell (td)
Sample
Div
classsIndent
Code Block
languagejavascript

// Create two tabs, then make the second one be displayed to the left of the first
// by setting their X coordinates in the needed order.
var firstTab = tabs.newTab('firstTab', 'Child Form', childForm, relation);
firstTab.x = 10;
var secondTab = tabs.newTab('secondTab', 'Another Child Form', anotherChildForm);
secondTab.x = 0;

...

Table Row (tr)
classlastDetailRow
Table Cell (td)

Table Body (tbody)
idy
Table Row (tr)
idname
Table Cell (td)
y
Table Row (tr)
iddes
Table Cell (td)
Div
classsIndent
The Y coordinate of the tab. Together with the X coordinate, this influences the order
in which the tabs are displayed. The tabs are displayed in increasing order of the X coordinate,
and if two tabs have the same X coordinate, then they are displayed in increasing order
of the Y coordinate.
Table Row (tr)
idret
Table Cell (td)
Returns
Div
classsIndent
Number
Table Row (tr)
idsam
Table Cell (td)
Sample
Div
classsIndent
Code Block
languagejavascript

// Create two tabs, then make the second one be displayed to the left of the first
// by setting their X to the same value and Y coordinates in the needed order. 
var firstTab = tabs.newTab('firstTab', 'Child Form', childForm, relation);
firstTab.x = 0;
firstTab.y = 10;
var secondTab = tabs.newTab('secondTab', 'Another Child Form', anotherChildForm);
secondTab.x = 0;
secondTab.y = 0;

...

Table Row (tr)
classlastDetailRow
Table Cell (td)


HTML Table
idfunction
classservoy sDetail
Colgroup Tag
Column
padding0px
width100%

Table Row (tr)
styleheight: 30px;
Table Head (th)
colspan1
Method Details
Table Body (tbody)
idgetUUID
Table Row (tr)
idname
Table Cell (td)
getUUID
Table Row (tr)
idsig
Table Cell (td)
Span
stylemargin-right: 5px;
UUID
Span
stylefont-weight: bold;
getUUID
Span
()
Table Row (tr)
iddes
Table Cell (td)
Div
classsIndent
Returns the UUID of this component.
Table Row (tr)
idret
Table Cell (td)
Returns
Div
classsIndent
UUID
Table Row (tr)
idsam
Table Cell (td)
Sample
Div
classsIndent
Code Block
languagejavascript

var button_uuid = solutionModel.getForm("my_form").getButton("my_button").getUUID();
application.output(button_uuid.toString());
{code}{div}{td}{tr}{tr:class=lastDetailRow}{td}{td}{tr}{tbody}{table}
Table Row (tr)
classlastDetailRow
Table Cell (td)