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
Extends
{column:width=80px|padding=0px}{column}{column}{column}
Constants Summary
ACCORDION_PANEL
Constant used for creating accordion panel from tab panel, by setting its tabOrientation.
DEFAULT_ORIENTATION
Constant used for restoring a tab panel orientation to it's initial state.
SPLIT_HORIZONTAL
Constant used for creating horizontal split pane from tab panel, by setting its tabOrientation.
SPLIT_VERTICAL
Constant used for creating vertical split pane from tab panel, by setting its tabOrientation.
{column:width=80px|padding=0px}{column}{column}{column}
Property Summary
background
The background color of the component.
borderType
The type, color and style of border of the component.
foreground
The foreground color of the component.
printSliding
Enables an element to resize based on its content and/or move when printing.
scrollTabs
Flag that tells how to arrange the tabs if they don't fit on a single line.
styleClass
The name of the style class that should be applied to this component.
tabOrientation
Specifies either the position of the tabs related to the tab panel or the type of tab-panel.
transparent
Flag that tells if the component is transparent or not.
{column:width=80px|padding=0px}{column}{column}{column}
Method Summary
getDesignTimeProperty()
Get a design-time property of an element.
putDesignTimeProperty()
Set a design-time property of an element.
removeDesignTimeProperty()
Clear a design-time property of an element.
void
removeTab(name)
Removes the tab with the specified name from the tab panel.
{column:width=100%|padding=0px}{column}
Constants Details
Sample
var accordion = myForm.newTabPanel('accordion', 10, 10, 620, 460); accordion.tabOrientation = JSTabPanel.ACCORDION_PANEL;
Sample
var splitPane = myForm.newTabPanel('splitPane', 10, 10, 620, 460); splitPane.tabOrientation = JSTabPanel.SPLIT_HORIZONTAL; // (...) some code when you decide it's better to revert the orientation splitPane.tabOrientation = JSTabPanel.DEFAULT_ORIENTATION;
Sample
var splitPane = myForm.newTabPanel('splitPane', 10, 10, 620, 460); splitPane.tabOrientation = JSTabPanel.HIDE;
Sample
var splitPane = myForm.newTabPanel('splitPane', 10, 10, 620, 460); splitPane.tabOrientation = JSTabPanel.SPLIT_HORIZONTAL;
Sample
var splitPane = myForm.newTabPanel('splitPane', 10, 10, 620, 460); splitPane.tabOrientation = JSTabPanel.SPLIT_VERTICAL;
{column:width=100%|padding=0px}{column}
Property Details
Sample
var form = solutionModel.newForm('mediaForm', 'db:/example_data/parent_table', null, false, 400, 300); var strechAllDirectionsLabel = form.newLabel('Strech all directions', 10, 10, 380, 280); strechAllDirectionsLabel.background = 'red'; strechAllDirectionsLabel.anchors = SM_ANCHOR.ALL; var strechVerticallyLabel = form.newLabel('Strech vertically', 10, 10, 190, 280); strechVerticallyLabel.background = 'green'; strechVerticallyLabel.anchors = SM_ANCHOR.WEST | SM_ANCHOR.NORTH | SM_ANCHOR.SOUTH; var strechHorizontallyLabel = form.newLabel('Strech horizontally', 10, 10, 380, 140); strechHorizontallyLabel.background = 'blue'; strechHorizontallyLabel.anchors = SM_ANCHOR.NORTH | SM_ANCHOR.WEST | SM_ANCHOR.EAST; var stickToTopLeftCornerLabel = form.newLabel('Stick to top-left corner', 10, 10, 200, 100); stickToTopLeftCornerLabel.background = 'orange'; stickToTopLeftCornerLabel.anchors = SM_ANCHOR.NORTH | SM_ANCHOR.WEST; // This is equivalent to SM_ANCHOR.DEFAULT var stickToBottomRightCornerLabel = form.newLabel('Stick to bottom-right corner', 190, 190, 200, 100); stickToBottomRightCornerLabel.background = 'pink'; stickToBottomRightCornerLabel.anchors = SM_ANCHOR.SOUTH | SM_ANCHOR.EAST;
Sample
// This property can be used on all types of components. // Here it is illustrated only for labels and fields. var greenLabel = form.newLabel('Green',10,10,100,50); greenLabel.background = 'green'; // Use generic names for colors. var redField = form.newField('parent_table_text',JSField.TEXT_FIELD,10,110,100,30); redField.background = '#FF0000'; // Use RGB codes for colors.
Sample
//HINT: To know exactly the notation of this property set it in the designer and then read it once out through the solution model. var field = form.newField('my_table_text', JSField.TEXT_FIELD, 10, 10, 100, 20); field.borderType = solutionModel.createLineBorder(1,'#ff0000');
Sample
var form = solutionModel.newForm('printForm', 'db:/example_data/parent_table', null, false, 400, 300); var field = form.newField('parent_table_text', JSField.TEXT_FIELD, 10, 10, 100, 20); field.enabled = false;
Sample
var label = form.newLabel('Text here', 10, 50, 100, 20); label.fontType = solutionModel.createFont('Times New Roman',1,14);
Sample
// This property can be used on all types of components. // Here it is illustrated only for labels and fields. var labelWithBlueText = form.newLabel('Blue text', 10, 10, 100, 30); labelWithBlueText.foreground = 'blue'; // Use generic names for colors. var fieldWithYellowText = form.newField('parent_table_text', JSField.TEXT_FIELD, 10, 50, 100, 20); fieldWithYellowText.foreground = '#FFFF00'; // Use RGB codes for colors.
Sample
var labelBelow = form.newLabel('Green', 10, 10, 100, 50); labelBelow.background = 'green'; labelBelow.formIndex = 10; var fieldAbove = form.newField('parent_table_text', JSField.TEXT_FIELD, 10, 10, 100, 30); fieldAbove.background = '#FF0000'; fieldAbove.formIndex = 20;
Sample
var form = solutionModel.newForm('someForm', 'db:/example_data/parent_table', null, false, 400, 300); var label = form.newLabel('Green', 10, 10, 100, 20); var field = form.newField('parent_table_text', JSField.TEXT_FIELD, 10, 40, 100, 20); label.groupID = 'someGroup'; field.groupID = 'someGroup'; forms['someForm'].elements.someGroup.enabled = false;
Sample
var field = form.newField('parent_table_text', JSField.TEXT_FIELD, 10, 10, 100, 20); application.output('original width: ' + field.width); application.output('original height: ' + field.height); field.width = 200; field.height = 100; application.output('modified width: ' + field.width); application.output('modified height: ' + field.height);
Sample
var form = solutionModel.newForm('someForm', 'db:/example_data/parent_table', null, false, 620, 300); var label = form.newLabel('Label', 10, 10, 150, 150); label.name = 'myLabel'; // Give a name to the component. forms['someForm'].controller.show() // Now use the name to access the component. forms['someForm'].elements['myLabel'].text = 'Updated text';
Sample
var onChangeMethod = form.newMethod('function onTabChange(previousIndex, event) { application.output("Tab changed from previous index " + previousIndex + " at " + event.getTimestamp()); }'); var tabPanel = form.newTabPanel('tabs', 10, 10, 620, 460); tabPanel.newTab('tab1', 'Child Two', childOne); tabPanel.newTab('tab2', 'Child Two', childTwo); tabPanel.onChange = onChangeMethod;
Sample
var form = solutionModel.newForm('printForm', 'db:/example_data/parent_table', null, false, 400, 300); var slidingLabel = form.newLabel('Some long text here', 10, 10, 5, 5); slidingLabel.printSliding = SM_PRINT_SLIDING.GROW_HEIGHT | SM_PRINT_SLIDING.GROW_WIDTH; slidingLabel.background = 'gray'; forms['printForm'].controller.showPrintPreview();
Sample
var form = solutionModel.newForm('printForm', 'db:/example_data/parent_table', null, false, 400, 300); var printedField = form.newField('parent_table_text', JSField.TEXT_FIELD, 10, 10, 100, 20); var notPrintedField = form.newField('parent_table_id', JSField.TEXT_FIELD, 10, 40, 100, 20); notPrintedField.printable = false; // This field won't show up in print preview and won't be printed. forms['printForm'].controller.showPrintPreview()
Sample
var tabPanel = form.newTabPanel('tabs', 10, 10, 200, 200); tabPanel.newTab('tab1', 'Child Two', childOne, parentToChild); // The first form uses the relation. tabPanel.newTab('tab2', 'Child Two', childTwo); tabPanel.scrollTabs = true;
Sample
var form = solutionModel.newForm('printForm', 'db:/example_data/parent_table', null, false, 400, 300); var field = form.newField('parent_table_text', JSField.TEXT_FIELD, 10, 10, 100, 20); var style = solutionModel.newStyle('myStyle','field.fancy { background-color: yellow; }'); form.styleName = 'myStyle'; // First set the style on the form. field.styleClass = 'fancy'; // Then set the style class on the field.
Sample
var tabPanel = form.newTabPanel('tabs', 10, 10, 620, 460); tabPanel.newTab('tab1', 'Child Two', childOne, parentToChild); // The first form uses the relation. tabPanel.newTab('tab2', 'Child Two', childTwo); // The SM_ALIGNMENT constants TOP, RIGHT, BOTTOM and LEFT can be used to put the // tabs into the needed position. Use HIDE to hide the tabs. Use DEFAULT_ORIENTATION to restore it to it's initial state. // The constants SPLIT_HORIZONTAL, SPLIT_VERTICAL can be used to create a split pane, // where the first tab will be the first component and the second tab will the second component. // ACCORDION_PANEL can be used to create an accordion pane. tabPanel.tabOrientation = SM_ALIGNMENT.BOTTOM;
Sample
// Create three fields. Based on how they are placed, by default they will come one // after another in the tab sequence. var fieldOne = form.newField('parent_table_id', JSField.TEXT_FIELD, 10, 10, 100, 20); var fieldTwo = form.newField('parent_table_text', JSField.TEXT_FIELD, 10, 40, 100, 20); var fieldThree = form.newField('parent_table_id', JSField.TEXT_FIELD, 10, 70, 100, 20); // Set the third field come before the first in the tab sequence, and remove the // second field from the tab sequence. fieldOne.tabSeq = 2; fieldTwo.tabSeq = SM_DEFAULTS.IGNORE; fieldThree.tabSeq = 1;
Sample
// Load an image from disk an create a Media object based on it. var imageBytes = plugins.file.readFile('d:/ball.jpg'); var media = solutionModel.newMedia('ball.jpg', imageBytes); // Put on the form a label with the image. var image = form.newLabel('', 10, 10, 100, 100); image.imageMedia = media; // Put two fields over the image. The second one will be transparent and the // image will shine through. var nonTransparentField = form.newField('parent_table_text', JSField.TEXT_FIELD, 10, 20, 100, 20); var transparentField = form.newField('parent_table_text', JSField.TEXT_FIELD, 10, 50, 100, 20); transparentField.transparent = true;
Sample
var form = solutionModel.newForm('printForm', 'db:/example_data/parent_table', null, false, 400, 300); var field = form.newField('parent_table_text', JSField.TEXT_FIELD, 10, 10, 100, 20); field.visible = false;
Sample
var field = form.newField('parent_table_text', JSField.TEXT_FIELD, 10, 10, 100, 20); application.output('original width: ' + field.width); application.output('original height: ' + field.height); field.width = 200; field.height = 100; application.output('modified width: ' + field.width); application.output('modified height: ' + field.height);
Sample
var field = form.newField('parent_table_text', JSField.TEXT_FIELD, 10, 10, 100, 20); application.output('original location: ' + field.x + ', ' + field.y); field.x = 90; field.y = 90; application.output('changed location: ' + field.x + ', ' + field.y);
Sample
var field = form.newField('parent_table_text', JSField.TEXT_FIELD, 10, 10, 100, 20); application.output('original location: ' + field.x + ', ' + field.y); field.x = 90; field.y = 90; application.output('changed location: ' + field.x + ', ' + field.y);
{column:width=100%|padding=0px}{column}
Method Details
getDesignTimeProperty
()
Sample
var frm = solutionModel.getForm('orders') var fld = frm.getField('fld') var prop = fld.getDesignTimeProperty('myprop')
getTab
(name)
Parameters
{String} name – The name of the tab that should be returned.
Returns
JSTab – A JSTab instance represented the requested tab.
Sample
var tabPanel = form.newTabPanel('tabs', 10, 10, 620, 460); tabPanel.newTab('tab1', 'Child Two', childOne); tabPanel.newTab('tab2', 'Child Two', childTwo); tabPanel.getTab('tab2').text = 'Child Two Changed';
JSTab[]
getTabs
()
Returns
JSTab[] – An array of JSTab instances representing all tabs of this tabpanel.
Sample
var tabPanel = form.newTabPanel('tabs', 10, 10, 620, 460); tabPanel.newTab('tab1', 'Child Two', childOne); tabPanel.newTab('tab2', 'Child Two', childTwo); var tabs = tabPanel.getTabs(); for (var i=0; i<tabs.length; i++) application.output("Tab " + i + " has text " + tabs[i].text);
Sample
var button_uuid = solutionModel.getForm("my_form").getButton("my_button").getUUID(); application.output(button_uuid.toString());
newTab
(name, text, form)
Returns
JSTab – A JSTab instance representing the newly created and added tab.
Sample
// Create a parent form. var form = solutionModel.newForm('parentForm', 'db:/example_data/parent_table', null, false, 640, 480); // Create a first child form. var childOne = solutionModel.newForm('childOne', 'db:/example_data/child_table', null, false, 400, 300); childOne.newField('child_table_text', JSField.TEXT_FIELD, 10, 10, 100, 20); // Create a relation to link the parent form to the first child form. var parentToChild = solutionModel.newRelation('parentToChild','db:/example_data/parent_table','db:/example_data/child_table',JSRelation.INNER_JOIN); parentToChild.newRelationItem('parent_table_id','=','child_table_parent_id'); // Create a second child form. var childTwo = solutionModel.newForm('childTwo', 'db:/example_data/my_table', null, false, 400, 300); childTwo.newField('my_table_image', JSField.IMAGE_MEDIA, 10, 10, 100, 100); // Create a tab panel and add two tabs to it, with the two child forms. var tabPanel = form.newTabPanel('tabs', 10, 10, 620, 460); tabPanel.newTab('tab1', 'Child Two', childOne, parentToChild); // The first form uses the relation. tabPanel.newTab('tab2', 'Child Two', childTwo);
newTab
(name, text, form, relation)
Parameters
{String} name – The name of the new tab.
{String} text – The text to be displayed on the new tab.
{JSForm} form – The JSForm instance that should be displayed in the new tab.
{Object} relation – A JSRelation object that relates the parent form with the form
that will be displayed in the new tab.
Returns
JSTab – A JSTab instance representing the newly created and added tab.
Sample
// Create a parent form. var form = solutionModel.newForm('parentForm', 'db:/example_data/parent_table', null, false, 640, 480); // Create a first child form. var childOne = solutionModel.newForm('childOne', 'db:/example_data/child_table', null, false, 400, 300); childOne.newField('child_table_text', JSField.TEXT_FIELD, 10, 10, 100, 20); // Create a relation to link the parent form to the first child form. var parentToChild = solutionModel.newRelation('parentToChild','db:/example_data/parent_table','db:/example_data/child_table',JSRelation.INNER_JOIN); parentToChild.newRelationItem('parent_table_id','=','child_table_parent_id'); // Create a second child form. var childTwo = solutionModel.newForm('childTwo', 'db:/example_data/my_table', null, false, 400, 300); childTwo.newField('my_table_image', JSField.IMAGE_MEDIA, 10, 10, 100, 100); // Create a tab panel and add two tabs to it, with the two child forms. var tabPanel = form.newTabPanel('tabs', 10, 10, 620, 460); tabPanel.newTab('tab1', 'Child Two', childOne, parentToChild); // The first form uses the relation. tabPanel.newTab('tab2', 'Child Two', childTwo);
putDesignTimeProperty
()
Sample
var frm = solutionModel.getForm('orders') var fld = frm.getField('fld') fld.putDesignTimeProperty('myprop', 'strawberry')
removeDesignTimeProperty
()
Sample
var frm = solutionModel.getForm('orders') var fld = frm.getField('fld') fld.removeDesignTimeProperty('myprop')
void
removeTab
(name)
Parameters
{String} name – the name of the tab to be removed
Returns
void
Sample
var tabPanel = form.newTabPanel('tabs', 10, 10, 620, 460); tabPanel.newTab('tab1', 'Child Two', childOne); tabPanel.newTab('tab2', 'Child Two', childTwo); tabPanel.removeTab('tab1');