User Guide Cancel

cfformgroup

Last updated on May 30, 2024 | Also applies to ColdFusion

CFML Reference User Guide
ColdFusion functions
ColdFusion Tags
1. ColdFusion tag summary
2. ColdFusion tags by category
  1. Application framework tags
    1. cfapplication
    2. cfassociate
    3. cferror
    4. cfimport
    5. cfinterface
    6. cflock
    7. cfscript
    8. cfthread
  2. Communications tags
  3. Database manipulation tags
  4. Data output tags
    1. cfchart
    2. cfchartdata
    3. cfchartseries
    4. cfcol
    5. cfcontent
    6. cfdocument
    7. cfdocumentitem
    8. cfdocumentsection
    9. cfflush
    10. cfheader
    11. cflog
    12. cfoutput
    13. cfpresentation
    14. cfpresentationslide
    15. cfpresenter
    16. cfprocessingdirective
    17. cfprint
    18. cfreport
    19. cfreportparam
    20. cfsilent
    21. cftable
  5. Debugging tags
    1. cfdump
    2. cftimer
    3. cftrace
  6. Exception handling tags
    1. cfcatch
    2. cferror
    3. cffinally
    4. cfrethrow
    5. cfthrow
    6. cftry
  7. Extensibility tags
    1. cfchart
    2. cfchartdata
    3. cfchartseries
    4. cfcollection
    5. cfcomponent
    6. cfexecute
    7. cfftp
    8. function
    9. cfindex
    10. cfinterface
    11. cfinvoke
    12. cfinvokeargument
    13. cfobject
    14. cfproperty
    15. cfreport
    16. cfreportparam
    17. cfreturn
    18. cfsearch
    19. cfsharepoint
    20. cfspreadsheet
    21. cfwddx
    22. cfxml
  8. File management tags
    1. cfdirectory
    2. cffile
    3. cffileupload
    4. cfftp
    5. cfzip
    6. cfzipparam
  9. Flow-control tags
    1. cfabort
    2. cfbreak
    3. cfcase
    4. cfcontinue
    5. cfdefaultcase
    6. cfelse
    7. cfelseif
    8. cfexecute
    9. cfexit
    10. cfif
    11. cfinclude
    12. cflocation
    13. cfloop
    14. cfrethrow
    15. cfswitch
    16. cfthrow
    17. cftry
  10. Forms tags
    1. cfapplet
    2. cfcalendar
    3. cffileupload
    4. cfform
    5. cfformgroup
    6. cfformitem
    7. cfgrid
    8. cfgridcolumn
    9. cfgridrow
    10. cfgridupdate
    11. cfinput
    12. cfpdf
    13. cfpdfform
    14. cfpdfformparam
    15. cfpdfparam
    16. cfpdfsubform
    17. cfselect
    18. cfslider
    19. cftextarea
    20. cftree
    21. cftreeitem
  11. Internet Protocol tags
    1. cfajaximport
    2. cfajaxproxy
    3. cfftp
    4. cffeed
    5. cfimap
    6. cfhttp
    7. cfhttpparam
    8. cfldap
    9. cfmail
    10. cfmailparam
    11. cfmailpart
    12. cfpop
    13. cfsprydataset
  12. Page processing tags
    1. cfcache
    2. cfcontent
    3. cfflush
    4. cfheader
    5. cfhtmlhead
    6. cfinclude
    7. cfprocessingdirective
    8. cfsetting
    9. cfsilent
  13. Security tags
  14. Variable manipulation tags
    1. cfcookie
    2. cfdump
    3. cfparam
    4. cfregistry
    5. cfsavecontent
    6. cfschedule
    7. cfset
    8. cfsetting
  15. Other tags
    1. cfimage
    2. cflog
    3. cfregistry
3. Tags a-b
4. Tags c
  1. cfcache
  2. cfcalendar
  3. cfcase
  4. cfcatch
  5. cfchart
  6. cfchartdata
  7. cfchartseries
  8. cfclient
  9. cfclientsettings
  10. cfcol
  11. cfcollection
  12. cfcomponent
  13. cfcontent
  14. cfcontinue
  15. cfcookie
  16. Tags d-e
5. Tags f
6. Tags g-h
  1. cfgraph
  2. cfgraphdata
  3. cfgrid
  4. cfgridcolumn
  5. cfgridrow
  6. cfgridupdate
  7. cfheader
  8. cfhtmlhead
  9. cfhtmltopdf
  10. cfhtmltopdfitem
  11. cfhttp
  12. cfhttpparam
7. Tags i
  1. cfif
  2. cfimage
  3. cfimap
  4. cfimapfilter
  5. cfimpersonate
  6. cfimport
  7. cfinclude
  8. cfindex
  9. cfinput
  10. cfinsert
  11. cfinterface
  12. cfinvoke
  13. cfinvokeargument
8. Tags j-l
9. Tags m-o
10. Tags p-q
  1. cfparam
  2. cfpdf
  3. cfpdfform
  4. cfpdfformparam
  5. cfpdfparam
  6. cfpdfsubform
  7. cfpod
  8. cfpop
  9. cfpresentation
  10. cfpresentationslide
  11. cfpresenter
  12. cfprint
  13. cfprocessingdirective
  14. cfprocparam
  15. cfprocresult
  16. cfprogressbar
  17. cfproperty
  18. cfquery
  19. cfqueryparam
11. Tags r-s
  1. cfregistry
  2. cfreport
  3. cfreportparam
  4. cfrethrow
  5. cfreturn
  6. cfsavecontent
  7. cfschedule
  8. cfscript
  9. cfsearch
  10. cfselect
  11. cfservlet
  12. cfservletparam
  13. cfset
  14. cfsetting
  15. cfsharepoint
  16. cfsilent
  17. cfslider
  18. cfspreadsheet
  19. cfsprydataset
  20. cfstoredproc
  21. cfswitch
12. Tags t
  1. cftable
  2. cftextarea
  3. cftextinput
  4. cfthread
  5. cfthrow
  6. cftimer
  7. cftooltip
  8. cftrace
  9. cftransaction
  10. cftree
  11. cftreeitem
  12. cftry
13. Tags u-z
  1. cfupdate
  2. cfwddx
  3. cfwebsocket
  4. cfwindow
  5. cfxml
  6. cfzip
  7. cfzipparam
CFML Reference
1. Reserved words and variables
2. Ajax JavaScript functions
3. ColdFusion ActionScript functions
4. ColdFusion mobile functions
5. Application.cfc reference
6. Script functions implemented as CFCs
7. ColdFusion Flash Form style reference
8. ColdFusion event gateway reference
9. ColdFusion C++ CFX Reference
10. ColdFusion Java CFX reference
11. WDDX JavaScript Objects
Cloud services

Description

Creates a container control for multiple form controls. Used in the cfform tag body of Adobe Flash and XML forms. Ignored in HTML forms.

Syntax

<cfformgroup
type = "group type"
label = "label"
style = "style specification"
selectedIndex = "page number">
width = "pixels"
height = "pixels"
enabled = "yes|no"
visible = "yes|no"
onChange = "ActionScript expression"
tooltip = "text"
id = "unique identifier">
...ColdFusion forms controls...
</cfformgroup>

OR

<cfformgroup
type = "repeater"
query = "query object"
maxrows = "integer">
startrow = "row number"
...ColdFusion forms controls
</cfformgroup>

Note: You can specify this tag's attributes in an attributeCollection attribute whose value is a structure. Specify the structure name in the attributeCollection attribute and use the tag's attribute names as structure keys.

History

ColdFusion MX 7: Added this tag.

Attributes

The following table lists the attributes and their behavior in Flash forms. For XML, if not otherwise noted, the attribute is passed to the XML but is not interpreted by the basic XSL style sheet provided with ColdFusion.

Note: Attributes that are not marked as supported in XML are not handled by the skins provided with ColdFusion. They are, however, included in the generated XML.

Attribute	Req/Opt; formats	Default	Description
type	Required;Flash and XML		XML: Can be any XForms group type defined in the XSLT. The XSL skins provided with ColdFusion support the following types: horizontal: align child tags horizontally within a form and put this tag's label attribute to the left of the children. vertical: align child tags vertically within a form and put this tag's label attribute to the left of the children. fieldset: corresponds to the HTML fieldset tag, which groups its children, typically by drawing a box around them and replacing part of the top line with legend text. To specify the legend, use the label attribute. To specify the box dimensions, use the style attribute with height and width values. Explicitly use cfformgroup type="vertical" inside this formgroup to align its child tags vertically.
			Flash: Must be one of the following: repeater: dynamically creates an instance of the cfformgroup's child tag or tags for each row of a query object, without requiring ColdFusion to recompile the Flash SWF file when the number of rows changes. horizontal: aligns child tags horizontally within a form and put this tag's label attribute to the left of the children. Use this tag to arrange individual controls horizontally. vertical: aligns child tags vertically within a form and puts this tag's label attribute to the left of the children. Use this tag to arrange individual controls vertically. hbox: aligns children horizontally. Use this type to arrange groups of form controls horizontally. Do not use this attribute to align individual controls horizontally, because the child controls do not align properly; use the horizontal type instead. vbox: aligns children vertically. Use this type to arrange groups of controls vertically. Do not use this attribute to align individual controls vertically, because the child controls do not align properly; use the vertical type instead.
			hdividedbox: aligns children horizontally. Each child is in a box with a border, and there are dividers between the boxes that users can move to change the relative sizes of the children. Use a tag with this attribute to arrange groups of form controls horizontally. You cannot use this attribute to align individual controls horizontally. vdividedbox: aligns children vertically. Each child is in a box with a border, and there are dividers between the boxes that users can move to change the relative sizes of the children. Use this type to group form controls, for example as a unit in an hbox form group. Do not use this attribute to align individual tags vertically. panel: a container consisting of a title bar containing the label attribute text, a border, and a content area with vertically arranged children. tile: places the children in a rectangular grid. accordion: places each child in a pleat of an expanding and contracting accordion. Define each pleat using a cfformgroup type="page" tag. tabnavigator: places the children in a tabbed dialog box. Define each tab by using a cfformgroup type="page" tag. page: places the children tags, aligned vertically, in a single tab of a parent tabnavigator or pleat of an accordion container.
query	Required for type= repeater, ignored otherwise;Flash		The query to use with the repeater. Flash creates an instance of each of the cfformgroup tag's child tags for each row in the query. You can use the bind attribute in the child tags to use data from the query row for the instance.
enabled	Optional;Flash	yes	Boolean value that specifies whether the controls in the form group are enabled. Disabled controls appear in light gray.
height	Optional; Flash		Height of the group container, in pixels. If you omit this attribute, Flash automatically sizes the container height. Ignored for Flash repeater type.
id	Optional;Flash		Unique identifier for the form group. When using the tabnavigator or accordion type, specify the id attribute to reference the controls through custom ActionScript.
label	Optional;Flash and XML		Label to apply to the form group. In Flash, does the following: For a page or panel form group, determines the label to put on the corresponding accordion pleat, the tabnavigator tab, or the panel title bar. For a Flash horizontal or vertical form group, specifies the label to put to the left of the group. Ignored in Flash for repeater, hbox, hdividedbox, vbox, vdividedbox, tile, accordion, and tabnavigator types.
maxrows	Optional;Flash		Used only for the repeater type; ignored otherwise.Specifies the maximum number of query rows to use in the Flash form repeater. If the query has more rows than the sum of the startrow attribute and this value, the repeater does not use the remaining rows.
onChange	Optional;Flash		Tabnavigator and accordion types only: ActionScript expression or expressions to execute when a new tab or accordion page is selected. Note: The onChange event occurs when the form first appears.
selectedIndex	Optional; Flash only		Used only for accordion and tabnavigator types; ignored otherwise. Specifies the page control to display as open, where 0 (not 1) specifies the first page control defined in the group.
startrow	Optional;Flash	0	Used only for the repeater type; ignored otherwise.Specifies the row number of the first row of the query to use in the Flash form repeater. This attribute is zero-based: the first row is row 0, not row 1 (as in most ColdFusion tags).
style	Optional;Flash and XML		Flash: a Flash style specification in CSS format. For detailed information on specifying Flash styles, see Creating Forms in Flash in the Developing ColdFusion Applications.XML: an inline CSS style specification.
tooltip	Optional;Flash		Text to display when the mouse pointer hovers in the form group area. If a control in the form group also specifies a tooltip, Flash displays the control's tooltip when the mouse pointer hovers over the control.
visible	Optional;Flash	yes	Boolean value specifying whether the controls in the form group are visible. If the controls are invisible, the space that would be occupied by visible controls is blank.
width	Optional;Flash and XML		Width of the group container, in pixels. If you omit this attribute, Flash automatically sizes the container width. Ignored for Flash repeater type.

Usage

This tag requires an end tag. This tag is ignored if the cfform type is HTML; any tag body's contents are interpreted as if the surrounding cfformgroup does not exist.
In Flash format forms, this tag organizes the contents of the form. It groups and arranges child tags. The body of this tag can contain the following tags; all other tags and text are ignored:

For more information on using this tag in Flash forms, see Creating Forms in Flash in the Developing ColdFusion Applications. In XML format, ColdFusion passes the tag and its attributes to the XML; it is the responsibility of the skin XSLT to handle the XML. The ColdFusion basic skin supports the horizontal, vertical, and dualselectlist styles only. For more information on using this tag in XML forms, see Creating Forms in Flash in the Developing ColdFusion Applications.

Example

For a simple example of an XML form that uses a single cfformgroup tag, see cfform.
The following example shows how to use the cfformgroup tag to arrange elements on a Flash form. It creates an hdividedbox container that has a vbox container on each side. The left box has heading text and two radio buttons. The right box has heading text and three check boxes.

<h3>Simple cfformgroup Example</h3> 
<cfform name="myform" height="450" width="500" format="Flash" > 
    <cfformgroup type="hdividedbox" > 
        <cfformgroup type="VBox"> 
            <cfformitem type="text" height="20"> 
                Pets: 
            </cfformitem> 
            <cfinput type="Radio" name="pets" label="Dogs" value="Dogs" checked> 
            <cfinput type="Radio" name="pets" label="Cats" value="Cats"> 
        </cfformgroup> 
  
        <cfformgroup type="VBox"> 
            <cfformitem type="text" height="20"> 
                Fruits: 
            </cfformitem> 
            <cfinput type = "Checkbox" name="chk1" Label="Apples" value="Apples"> 
            <cfinput type="Checkbox" name="chk2" Label="Bananas" value="Bananas"> 
            <cfinput type="Checkbox" name="chk3" Label="Pears" value="Pears"> 
        </cfformgroup> 
    </cfformgroup> 
</cfform>

The following more complex example shows more fully how you can use cfformgroup tags to arrange controls in a Flash form. It also shows many of the text formatting features that you can use in a textcfformgroup body. When you submit the form, the page dumps the contents of the Forms scope, to show you the submitted data.

<h2>cfformgroup Example</h2> 
<cfif IsDefined("form.oncethrough")> 
    <h3>The form submitted the following information to ColdFusion:</h3> 
    <cfdump var="#form#"><br><br><br> 
</cfif> 
  
<h3>A Flash form using cfformgroup tags</h3> 
<cfform name="myform" height="450" width="500" format="Flash"> 
  
<!--- The following formgroup shows how you can present formatted text. ---> 
    <cfformitem type="html"> 
        <b><font color="#FF0000" size="+4" face="serif"> 
        This form has two tabs, asking for the following:</font></b><br> 
        <li>contact information</li> 
        <li><i>preferences</i></li> 
        <b>Try entering information on both tabs</b><br> 
        Submit the form and see what ColdFusion gets in the Forms scope.</b><br> 
        <a href="http://www..com/" target="_blank"> 
        <font color="#0000FF"><u> 
        This link displays the home page in a new browser window 
        </u></font></a><br> 
        &nbsp;<br> 
    </cfformitem> 
  
<!--- Use a tabnavigator with two tabs for user input. ---> 
    <cfformgroup type="tabnavigator" height="220"> 
        <cfformgroup type="page" label="Contact Information"> 
            <!--- Align the first and last name fields horizontally ---> 
            <cfformgroup type="horizontal" label="Your Name"> 
                <cfinput type="text" required="Yes" name="firstName" label="First"
                    value="" width="100"/> 
                <cfinput type="text" required="Yes" name="lastName" label="Last"
                    value="" width="100"/> 
            </cfformgroup> 
            <cfformitem type="html"><textformat indent="95"><font size="-2"> 
                Flash fills the email field in automatically.  
                You can replace any of the text. 
                </font></textformat> 
            </cfformitem> 
            <!--- The bind attribute gets the field contents from the firstname and lastName 
                fields as they get filled in. ---> 
            <cfinput type="text" name="email" label="email"
                bind="{firstName.text}.{lastName.text}@mm.com"> 
          
            <cfinput type="text" name="phone" validate="telephone" required="Yes"
                label="Phone Number"> 
        </cfformgroup> 
  
        <cfformgroup type="page" label="Preferences"> 
            <cfformitem type="text" height="30"> 
                <b>Tell us your preferences</b> 
            </cfformitem> 
            <!--- Put the pet selectors to the left of the fruit selectors. ---> 
            <cfformgroup type="hbox"> 
            <!--- Group the pet selector box contents, aligned vertically. ---> 
                <cfformgroup type="vbox"> 
                    <cfformitem type="text" height="20"> 
                        Pets: 
                    </cfformitem> 
                    <cfformgroup type="vertical"> 
                        <cfinput type="Radio" name="pets" label="Dogs" value="Dogs"
                            checked> 
                        <cfinput type="Radio" name="pets" label="Cats" value="Cats"> 
                    </cfformgroup> 
                </cfformgroup> 
            <!--- Group the fruit selector box contents, aligned vertically. ---> 
                <cfformgroup type="vbox"> 
                    <cfformitem type="text" height="20"> 
                        Fruits: 
                    </cfformitem> 
                    <cfformgroup type="tile" width="200" label="Tile box"> 
                        <--- Flash requires unique names for all controls ---> 
                        <cfinput type = "Checkbox" name="chk1" Label="Apples"
                            value="Apples"> 
                        <cfinput type="Checkbox" name="chk2" Label="Bananas"
                            value="Bananas"> 
                        <cfinput type="Checkbox" name="chk3" Label="Pears"
                            value="Pears"> 
                        <cfinput type="Checkbox" name="chk4" Label="Oranges"
                            value="Oranges"> 
                        <cfinput type="Checkbox" name="chk5" Label="Grapes"
                            value="Grapes"> 
                        <cfinput type="Checkbox" name="chk6" Label="Cumquats"
                            value="Cumquats"> 
                    </cfformgroup> 
                </cfformgroup> 
            </cfformgroup> 
        </cfformgroup> 
    </cfformgroup> 
  
    <cfformgroup type="horizontal"> 
        <cfinput type = "submit" name="submit" width="100" value = "Show Results"> 
        <cfinput type = "reset" name="reset" width="100" value = "Reset Fields"> 
        <cfinput type = "hidden" name="oncethrough" value = "Yes"> 
    </cfformgroup> 
</cfform>

Get help faster and easier

New user?

cfformgroup

Description

Category