ColdFusion 9.0 Resources |
cfformgroupDescriptionCreates 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.
See alsocfapplet, cfcalendar, cfform, cfformitem, cfgrid, cfinput, cfselect, cfslider, cftextarea, cftree, Using the cfformgroup tag to structure forms and Using cfformgroup tags in the Developing ColdFusion Applications. AttributesThe 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.
UsageThis 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. ExampleFor 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 text cfformgroup 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> <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> |