![]() ![]() ![]() |
This section contains the complete syntax, with examples, for VTML containers and controls.
<CONTAINER TYPE="TabDialog" ... |
---|
TabDialog control is a special container control, because it can only contain <CONTAINER TYPE="TabPage"> tags. This is natural because one needs to specify the tab pages before embedding more controls on the tab dialog itself. |
<CONTAINER NAME="MainTabDialog" TYPE="TabDialog" WIDTH=MAXIMUM HEIGHT=MAXIMUM> <CONTAINER NAME="TabPage1" TYPE="TabPage" CAPTION="TEXTAREA Tag"> ... embedded controls </CONTAINER> <CONTAINER NAME="TabPage2" TYPE="TabPage" CAPTION="Content"> ... embedded controls </CONTAINER> </CONTAINER>
<CONTAINER TYPE="TabPage" ... | |
---|---|
TabPage control is also special because it can only be contained inside a TabDialog CONTAINER control. | |
CAPTION | Caption displayed on the top of the tab. |
<CONTAINER NAME="MainTabDialog" TYPE="TabDialog" WIDTH=MAXIMUM HEIGHT=MAXIMUM> <CONTAINER NAME="TabPage1" TYPE="TabPage" CAPTION="TEXTAREA Tag"> ... embedded controls </CONTAINER> <CONTAINER NAME="TabPage2" TYPE="TabPage" CAPTION="Content"> ... embedded controls </CONTAINER> </CONTAINER>
<CONTAINER TYPE="Panel" ... | |
---|---|
Panel is the most common container control. Panel can contain any control or container except TabPage, which is restricted to TabDialog. | |
CAPTION | Caption displayed in the upper left corner of the panel boundary. |
<EDITORLAYOUT HEIGHT=225> <CONTAINER NAME="MainTabDialog" TYPE="TabDialog" WIDTH=MAXIMUM HEIGHT=MAXIMUM> <CONTAINER NAME="TabPage1" TYPE="TabPage" CAPTION="MYTAG Tag"> <CONTAINER NAME="Panel1" TYPE="Panel" DOWN=5 RIGHT=10 WIDTH="MAXIMUM" HEIGHT=125> <CONTROL NAME="lblSource" TYPE="Label" CAPTION="Source:" DOWN=17 RIGHT=10 WIDTH=50/> <CONTROL NAME="txtSource" TYPE="TextBox" ANCHOR="lblSource" CORNER="NE" WIDTH="MAXIMUM"/> <CONTROL NAME="lblAlign" TYPE="Label" CAPTION="Align:" ANCHOR="lblSource" CORNER="SW" DOWN=11 WIDTH=50/> <CONTROL NAME="dropAlign">TYPE="DropDown" ANCHOR="lblAlign" CORNER="NE" WIDTH=100> <ITEM VALUE="TOP" CAPTION="TOP" /> <ITEM VALUE="MIDDLE" CAPTION="MIDDLE" SELECTED/> <ITEM VALUE="BOTTOM" CAPTION="BOTTOM" /> </CONTROL> </CONTAINER> <CONTAINER NAME="Panel2" TYPE="Panel" CAPTION=" Panel 2 " ANCHOR="Panel1" CORNER="SW" DOWN=5 WIDTH="MAXIMUM" HEIGHT=MAXIMUM </CONTAINER> </CONTAINER> <CONTAINER NAME="Advanced" TYPE="TabPage" CAPTION="Advanced"> </CONTAINER> </CONTAINER> </EDITORLAYOUT>
<CONTROL TYPE="Label" ... | |
---|---|
Panel is the most common container control. Panel can contain any control or container except TabPage, which is restricted to TabDialog. | |
CAPTION | The text displayed by the label. |
AUTOSIZE | YES\NO. Automatically sizes the control to the text it contains. This option is overridden if WIDTH or HEIGHT are explicitly specified. |
TRANSPARENT | YES\NO. Makes label transparent. |
ALIGN | LEFT\CENTER\RIGHT. Specifies the horizontal alignment of text in the label. |
VALIGN | TOP\CENTER\BOTTOM. Specifies the vertical alignment of text in the label. |
<CONTROL NAME="lblSource" TYPE="Label" CAPTION="Source:" DOWN=17 RIGHT=10 WIDTH=50/>
<CONTROL TYPE="TextBox" ... | |
---|---|
A simple textbox control. | |
VALUE | The text displayed by the textbox. |
AUTOSIZE | YES\NO. Automatically sizes the control to the text it contains. This option is overridden if WIDTH or HEIGHT are explicitly specified. |
EDITABLE | YES\NO. Enables or disables editing. |
AUTOSELECT | YES\NO. Decides whether contents get highlighted when the cursor enters the textbox. |
MAXLENGTH | Limits the amount of text in the textbox to a specific number of characters. |
PASSWORDCHAR | A character to be used to mask entered text. You can create a simple password box using PASSWORDCHAR="*". |
CHARCASE | NORMAL\UPPER\LOWER. Specifies whether entered text is automatically uppercased of lowercased. The default is NORMAL, preserving entered case. |
VALIGN | TOP\CENTER\BOTTOM. Specifies the vertical alignment of text in the label. |
<CONTROL NAME="lblSource" TYPE="Label" CAPTION="Source:" DOWN=17 RIGHT=10 WIDTH=50/> <CONTROL NAME="txtSource" TYPE="TextBox" VALUE="Some Value" ANCHOR="lblSource" CORNER="NE" WIDTH="MAXIMUM"/>
<CONTROL TYPE="DropDown" ... | |
---|---|
A drop-down listbox. This tag requires <ITEM> sub-tags, which specify the list of items in the drop-down list. The item tag has CAPTION and VALUE attributes. CAPTION specifies the visible item text while VALUE specifies the underlying value for the option. SELECTED attribute specifies which item is initially selected. Then free-text is entered into an EDITABLE DropDown, the actual text is considered to be the value of the control.
Example:
<CONTROL NAME="dropTagOptions" TYPE="DropDown" WIDTH="200"> <ITEM CAPTION="option1" VALUE="Value1"/> <ITEM CAPTION="option2" VALUE="Value2" SELECTED/> <ITEM CAPTION="option3" VALUE="Value3"/> </CONTROL> | |
EDITABLE | The EDITABLE attribute decides whether it behaves like an editable combo-box or a fixed listbox. |
<CONTROL NAME="lblAlign" TYPE="Label" CAPTION="Align:" ANCHOR="lblSource" CORNER="SW" DOWN=11 WIDTH=50/> <CONTROL NAME="dropAlign" TYPE="DropDown" ANCHOR="lblAlign" CORNER="NE" WIDTH=100> <ITEM VALUE="TOP" CAPTION="TOP" /> <ITEM VALUE="MIDDLE" CAPTION="MIDDLE" SELECTED/> <ITEM VALUE="BOTTOM" CAPTION="BOTTOM" /> </CONTROL>
<CONTROL TYPE="ListBox" ... | |
---|---|
A single or multiple-select non-editable listbox. This tag requires <ITEM> sub-tags, which specify the items in list. The item tag has CAPTION and VALUE attributes. CAPTION specifies the visible item text while VALUE specifies the underlying value for the option. SELECTED attribute specifies which item is initially selected.
Example:
<CONTROL NAME="dropTagOptions" TYPE="DropDown" WIDTH="200"> <ITEM CAPTION="option1" VALUE="Value1"/> <ITEM CAPTION="option2" VALUE="Value2" SELECTED/> <ITEM CAPTION="option3" VALUE="Value3"/> </CONTROL> | |
MULTISELECT | (optional) Enables the user to select multiple items. When mutliple selections are made the control returns the values as a comma-delimited string. |
<CONTROL NAME="lblChoices" TYPE="Label" CAPTION="Choices:" ANCHOR="lblSource" CORNER="SW" DOWN=11 WIDTH=50/> <CONTROL NAME="listAlign" TYPE="ListBox" ANCHOR="lblChoices" CORNER="NE" WIDTH=100 HEIGHT=50> <ITEM VALUE="TOP" CAPTION="TOP" /> <ITEM VALUE="MIDDLE" CAPTION="MIDDLE" SELECTED/> <ITEM VALUE="BOTTOM" CAPTION="BOTTOM" /> </CONTROL>
<CONTROL TYPE="StyleTextBox" ... |
---|
A simple textbox with a button to invoke the CSS Style Editor. Enables creation as well as editing if CSS styles. |
<CONTROL NAME="txtSomeStyle" TYPE="StyleTextBox" ANCHOR="lblColor" CORNER="NE" WIDTH="MAXIMUM"/>
<CONTROL TYPE="StyleTextArea" ... | |
---|---|
A multiline textarea control with a button to invoke the CSS Style Editor. Enables creation as well as editing if CSS styles. | |
SCROLLBAR | NONE\HORIZONTAL\VERTICAL\BOTH. Specifies which scrollbars should be displayed. |
WRAP | YES\NO. Enables wrapping of text. |
<CONTROL NAME="areaSomeStyle" TYPE="StyleTextArea" ANCHOR="lblColor" CORNER="NE" WIDTH="MAXIMUM" />
<CONTROL TYPE="FontPicker" ... | |
---|---|
A simple drop-down list font picker. | |
EDITABLE | The EDITABLE attribute decides whether a font name can be entered manually into the listbox. |
<CONTROL NAME="lblFace" TYPE="Label" CAPTION="Font:" DOWN=17 RIGHT=10 WIDTH=50/> <CONTROL NAME="fontFace" TYPE="FontPicker" ANCHOR="lblFace" CORNER="NE" WIDTH="MAXIMUM"/>
<CONTROL TYPE="ColorPicker" ... |
---|
A simple drop-down color picker. Enables selection of a predefined color or the special color code. Control returns value as a color name or hexadecimal value based on user's preferences. |
<CONTROL NAME="lblColor" TYPE="Label" CAPTION="Color:" ANCHOR="lblFace" CORNER="SW" DOWN=11 WIDTH=50/> <CONTROL NAME="colorColor" TYPE="ColorPicker" ANCHOR="lblColor" CORNER="NE" WIDTH="MAXIMUM"/> <CONTROL NAME="lblColor" TYPE="Label" CAPTION="Color:" ANCHOR="lblFace" CORNER="SW" DOWN=11 WIDTH=50/> <CONTROL NAME="colorColor" TYPE="ColorPicker" ANCHOR="lblColor" CORNER="NE" WIDTH="MAXIMUM"/>![]()
<CONTROL TYPE="CheckBox" ... | |
---|---|
A simple checkbox control. Returns `true' or `false'. | |
CAPTION | Caption displayed next to the checkbox. |
CHECKED | YES\NO. Specifies initial status. |
<CONTROL NAME="checkNoShading"TYPE="CheckBox" CAPTION=" No Shading" ANCHOR="numWidth" CORNER="NE" DOWN=4 RIGHT=20 WIDTH=MAXIMUM/>
<CONTROL TYPE="RadioGroup" ... |
---|
A set of radio buttons. This tag requires <ITEM> sub-tags, that specify the list of radio buttons. The item tag has CAPTION and VALUE attributes. CAPTION specifies the caption of the radio button, VALUE specifies the underlying value for the option. The SELECTED attribute specifies which radio options should be pre-selected.
Example:
<CONTROL NAME="radioTagOptions" TYPE="RadioGroup" WIDTH="200"> <ITEM CAPTION="option1" VALUE="Value1"/> <ITEM CAPTION="option2" VALUE="Value2" SELECTED/> <ITEM CAPTION="option3" VALUE="Value3"/> </CONTROL> |
<CONTROL NAME="radioNameConflict" TYPE="RadioGroup" CAPTION="Radio One" ANCHOR="lblAccept" CORNER="SW" DOWN=35 HEIGHT=MAXIMUM WIDTH=MAXIMUM <ITEM VALUE="ERROR" CAPTION="ERROR - The file will not be saved and ColdFusion will return an error." SELECTED="TRUE"/> <ITEM VALUE="SKIP" CAPTION="SKIP - Neither saves the file nor throws an error."/> <ITEM VALUE="OVERWRITE" CAPTION="OVERWRITE - Replaces the existing file if name conflict occurs." /> <ITEM VALUE="MAKEUNIQUE" CAPTION="MAKEUNIQUE - Automatically generates a unique filename for the upload." /> </CONTROL>
<CONTROL TYPE="TextArea" ... | |
---|---|
A simple multi-line text entry control. | |
SCROLLBAR | NONE\HORIZONTAL\VERTICAL\BOTH. Specifies which scrollbars should be displayed. |
WRAP | YES\NO. Enables wrapping of text. |
<CONTROL NAME="txtContent" TYPE="TextArea" DOWN=5 RIGHT=5 WIDTH=MAXIMUM HEIGHT=MAXIMUM MAXWIDTHPADDING=5 MAXHEIGHTPADDING=5/>
<CONTROL TYPE="SQLTextArea" ... (ColdFusion Studio ONLY) | |
---|---|
A multi-line text entry control that allows the user to execute an SQL statement. The control contains a button that the user can use to invoke the query builder. | |
SCROLLBAR | NONE\HORIZONTAL\VERTICAL\BOTH. Specifies which scrollbars should be displayed. |
DSNAMECONTROL | The name of the control that should be populated with the Data Source name when a query is selected. |
QUERYNAMECONTROL | The name of the control that should be populated with the Query Name when a query is selected. |
WRAP | YES\NO. Enables wrapping of text. |
<CONTAINER NAME="TabPage1" TYPE="TabPage" CAPTION="CFQUERY Tag"> <CONTAINER NAME="Panel1" TYPE="Panel" DOWN=5 RIGHT=10 WIDTH="MAXIMUM" HEIGHT=80> <CONTROL NAME="lblQueryName" TYPE="Label" CAPTION="Query Name:" DOWN=17 RIGHT=10 WIDTH=80/> <CONTROL NAME="lblDataSource" TYPE="Label" CAPTION="Data Source:" ANCHOR="lblQueryName" CORNER="SW" DOWN=10 RIGHT=0 WIDTH=80/> <CONTROL NAME="txtQueryName" TYPE="TextBox" ANCHOR="lblQueryName" CORNER="NE" WIDTH=130/> <CONTROL NAME="txtDataSource" TYPE="TextBox" ANCHOR="lblDataSource" CORNER="NE" WIDTH=130/> <CONTROL NAME="lblMaxRows" TYPE="Label" CAPTION="Max Rows:" ANCHOR="txtQueryName" CORNER="NE" DOWN=0 RIGHT=10 WIDTH=70/> <CONTROL NAME="lblTimeout" TYPE="Label" CAPTION="Timeout:" ANCHOR="txtDataSource" CORNER="NE" DOWN=0 RIGHT=10 WIDTH=70/> <CONTROL NAME="numMaxRows" TYPE="TextBox" ANCHOR="lblMaxRows" CORNER="NE" WIDTH=30/> <CONTROL NAME="numTimeout" TYPE="TextBox" ANCHOR="lblTimeout" CORNER="NE" WIDTH=30/> <CONTROL NAME="checkDebug" TYPE="CheckBox" CAPTION="Print debug info" ANCHOR="numTimeout" CORNER="NE" RIGHT=10 DOWN=4 WIDTH=MAXIMUM/> </CONTAINER> <CONTROL NAME="lblSQLStatement" TYPE="Label" CAPTION="SQL Statement:" ANCHOR="Panel1" CORNER="SW"DOWN=10 RIGHT=0 WIDTH=110/> <CONTROL NAME="txtSQLStatement" TYPE="SQLTextArea" ANCHOR="lblSQLStatement" CORNER="SW" DOWN="8" WIDTH=MAXIMUM HEIGHT=MAXIMUM DSNAMECONTROL="txtDataSource" QUERYNAMECONTROL="txtQueryName"/> </CONTAINER>
<CONTROL TYPE="FileBrowser" ... | |
---|---|
A textbox used to enter a file path. The control contains two toolbar buttons providing accessibility to local and remote file\directory browsing. | |
CAPTION | The window caption that should displayed in the file\directory browsing dialogs. For example: CAPTION="Select File You Want Uploaded". |
FILTER | The file filter that should be used by the file\directory browsing dialogs. For example: FILTER="*.gif;*.jpeg;*.jpg". |
DIRONLY | YES\NO. Specifies that a directory is being selected. This option will convert the file dialogs accessible from the browse buttons to become directory-browsing dialogs. By default, file-browsing is assumed. |
FILENAMEONLY | YES\NO. Specifies that only a file name should be entered into the textbox when a file is specified in a local or remote file dialog. By default the entire path would be pasted. The attribute is irrelevant when the DIRONLY attribute is used. |
RELATIVE | YES\NO. Instructs the control to calculate the relative path when a file or a directory path is selected. The relative path is calculated relative to the file currently opened. When a new file is being edited, it first has to be saved before a relative path can be calculated. By default, the absolute path is assumed. |
<CONTROL NAME="lblSource" TYPE="Label" CAPTION="Source:" DOWN=17 RIGHT=10 WIDTH=60/> <CONTROL NAME="txtSource" TYPE="FileBrowser" ANCHOR="lblSource" CORNER="NE" WIDTH="MAXIMUM" RELATIVE FILTER="*.htm;*.html;*.cfml;*.cfm;*.asp" />
<CONTROL TYPE="Image" ... | |
---|---|
An image control capable of containing BMP images. | |
FILEPATH | Specifies the relative path of the image file from the editor template. |
AUTOSIZE | YES\NO. Automatically sizes the control to the image it contains. This option is overridden if WIDTH or HEIGHT are explicitly specified. |
TRANSPARENT | YES\NO. Controls transparency. |
CENTER | YES\NO. Centers the image. |
<CONTROL NAME="imgApplet" TYPE="Image" FILEPATH="Images/Applet.bmp" DOWN=10 RIGHT=10 AUTOSIZE="Yes"/>
<CONTROL TYPE="ActiveX" ... | |
---|---|
A container for an embedded ActiveX control. For an ActiveX control to function properly within a tag editor, the ActiveX control must implement four methods:
| |
PROGID | The ProgID of the ActiveX control. |
<CONTROL NAME="activexGizmoPicker" TYPE="ActiveX" PROGID="company.Gizmo"/>
![]() ![]() ![]() |
AllaireDoc@allaire.com
Copyright © 1998, Allaire Corporation. All rights reserved.