cfform
Description
Builds a form with CFML custom control tags; these provide more functionality than standard HTML form input elements. You can include the resulting form on the client page as HTML or Adobe Flash content, and generate the form by using XML and XSLT.
Categories
Related
cfajaximport cfapplet cfcalendar cfformgroup cfformitem cfgrid cfinput cfselect cfslider cftextarea cftree
History
ColdFusion
8:
Added support for adding interactive fields in
PDF forms.
Added the onSuccess attribute and support
in AJAX controls for the onError attribute
ColdFusion
MX 7:
Added ability to set the default value of the scriptSrc attribute
in the ColdFusion Administrator.
Deprecated the passthrough attribute. The
tag now supports all HTML form tag attributes directly.
Added the method attribute and support for
the GET method.
Added support for Flash and XML output, including the format, height, width, preloader, timeout, wMode, accessible,
and skin attributes.
Added cfformgroup, cfformitem,
and cftextarea child tags.
Added the onReset attribute.
ColdFusion
MX:
Deprecated the enableCAB attribute.
It might not work, and might cause an error, in later releases.
Changed the name and action attributes
to optional.
Changed integer validation to require an integer value. In
previous releases it would convert a floating point value to an
integer.
Syntax
<cfform
accessible = "yes|no"
action = "form action"
archive = "URL"
codeBase = "URL"
format = "HTML|Flash|XML"
height = "pixels|percent"
id = "HTML id" method = "POST|GET"
name = "name"
onError = "JavaScript function name or ActionScript code"
onLoad = "load event script" onReset = "reset event script" onSubmit = "JavaScript"
onSuccess = "JavaScript function name"
preloader = "yes|no"
preserveData = "yes|no"
scriptSrc = "path"
skin = "Flash skin|XSL skin"
style = "style specification"
timeout = "seconds"
width = "pixels|percent"
wMode = "window|transparent|opaque">
...
</cfform>
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.
Attributes
| Attribute | Description | Required | Default |
|---|---|---|---|
| accessible | Flash | ||
| action | Flash HTML XML | ||
| archive | applets in HTML and XML | ||
| codeBase | applets in HTML and XML | ||
| format | Flash HTML XML | ||
| height | Flash XML | ||
| id | |||
| method | Flash HTML XML | ||
| name | Flash HTML XML | ||
| onError | Flash HTML | ||
| onLoad | HTML XML | ||
| onReset | HTML XML | ||
| onSubmit | Flash HTML XML | ||
| onSuccess | HTML | ||
| preloader | Flash | ||
| preserveData | HTML XML | ||
| scriptSrc | Flash HTML XML | ||
| skin | Flash XML | ||
| style | HTML, Flash, XML | ||
| timeout | Flash | ||
| width | Flash XML | ||
| wMode | Flash |
Usage
This tag requires an end tag.
You can use the following ColdFusion form control tags in the cfform tag:
cfapplet: Used in HTML and XML format only; embeds a registered Java applet.
cfformgroup: Used in Flash and XML format only; groups and arranges child controls.
cfformitem: Used in Flash and XML format only; adds horizontal rules, vertical rules, and text to the form.
cfgrid: Creates a grid control to display tabular data.
cfinput: Creates and an input element.
cfselect: Creates a drop-down list box.
cfslider: Used in HTML and XML format only; creates a slider control.
cftextarea: Creates a multiline text input box.
cftree: Creates a tree control.
In HTML format, all tags, and in Flash format the cftree and cfgrid tags, require JavaScript support on the browser. The cfapplet tag and applet format cfgrid, cfslider, and cftree tags require the client to download a Java applet.
If you specify Flash format in the cfform tag, ColdFusion ignores any HTML in the form body. Use ColdFusion tags, such as cfinput, for all form controls. You can include individual Flash format cfgrid and cftree controls in an HTML format cfform tag.
In Flash format, if your forms do not request sensitive data (such as credit card numbers), consider setting the timeout attribute. This can prevent users from getting "The form data has expired. Please reload this page in your browser" errors if they use the browser back button to return to the form. For more information, see Caching data in Flash forms in the Developing ColdFusion Applications.
Note: In Flash format, if you do not specify height and width attributes, Flash reserves browser space equal to the area of the browser window. If any other output follows the form, users must scroll to see it. Therefore, if you follow a Flash form with additional output, specify the height and width values. The width and height attributes are required for Flash forms, if they are used inside of a table.
If attribute value text must include quotation marks, escape them by doubling them.
You can use the following ColdFusion form control tags in the cfform tag:
cfapplet: Used in HTML and XML format only; embeds a registered Java applet.
cfformgroup: Used in Flash and XML format only; groups and arranges child controls.
cfformitem: Used in Flash and XML format only; adds horizontal rules, vertical rules, and text to the form.
cfgrid: Creates a grid control to display tabular data.
cfinput: Creates and an input element.
cfselect: Creates a drop-down list box.
cfslider: Used in HTML and XML format only; creates a slider control.
cftextarea: Creates a multiline text input box.
cftree: Creates a tree control.
In HTML format, all tags, and in Flash format the cftree and cfgrid tags, require JavaScript support on the browser. The cfapplet tag and applet format cfgrid, cfslider, and cftree tags require the client to download a Java applet.
If you specify Flash format in the cfform tag, ColdFusion ignores any HTML in the form body. Use ColdFusion tags, such as cfinput, for all form controls. You can include individual Flash format cfgrid and cftree controls in an HTML format cfform tag.
In Flash format, if your forms do not request sensitive data (such as credit card numbers), consider setting the timeout attribute. This can prevent users from getting "The form data has expired. Please reload this page in your browser" errors if they use the browser back button to return to the form. For more information, see Caching data in Flash forms in the Developing ColdFusion Applications.
Note: In Flash format, if you do not specify height and width attributes, Flash reserves browser space equal to the area of the browser window. If any other output follows the form, users must scroll to see it. Therefore, if you follow a Flash form with additional output, specify the height and width values. The width and height attributes are required for Flash forms, if they are used inside of a table.
If attribute value text must include quotation marks, escape them by doubling them.
Example
<h3>cfform Example</h3>
<!--- If Form.oncethrough exists, the form has been submitted. --->
<cfif IsDefined("Form.oncethrough")>
<cfif IsDefined("Form.testVal1")>
<h3>Results of Radio Button Test</h3>
<cfif Form.testVal1>Your radio button answer was yes
<cfelse>Your radio button answer was no
</cfif>
</cfif>
<h3>Results of Checkbox Test</h3>
<cfif IsDefined("Form.chkTest2")>
Your checkbox answer was yes
<cfelse>
Your checkbox answer was no
</cfif>
<cfif IsDefined("Form.textSample") AND Form.textSample is not "">
<h3>Results of Credit Card Input</h3>
Your credit card number, <cfoutput>#Form.textSample#</cfoutput>,
was valid under the MOD 10 algorithm.
</cfif>
<cfif IsDefined("Form.sampleSlider")>
<cfoutput>
<h3>You gave this page a rating of #Form.sampleSlider#</h3>
</cfoutput>
</cfif>
<hr noshade="True">
</cfif>
<!--- Begin by calling the cfform tag. --->
<cfform name="cfformexample">
<h4>This example displays radio button input type for cfinput.</h4>
Yes <cfinput type = "Radio" name = "TestVal1" value = "Yes" checked>
No <cfinput type = "Radio" name = "TestVal1" value = "No">
<h4>This example displays checkbox input type for cfinput.</h4>
<cfinput type = "Checkbox" name = "ChkTest2" value = "Yes">
<h4>This shows client-side validation for cfinput text boxes.</h4>
(<i>This item is optional</i>)<br>
Please enter a credit card number:
<cfinput type = "Text" name = "TextSample"
message = "Please enter a Credit Card Number"
validate = "creditcard" required = "No">
<h4>This example shows the use of the cfslider tag.</h4>
Rate your approval of this example from 1 to 10 by sliding control.<br>
1 <cfslider name = "sampleSlider" width="100"
label = "Page Value: " range = "1,10"
message = "Please enter a value from 1 to 10"> 10
<cfinput type = "submit" name = "submit" value = "show me the result">
<cfinput type = "hidden" name = "oncethrough" value = "Yes"></p>
</cfform>