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

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

AttributeDescriptionRequiredDefault
accessibleFlash
actionFlash HTML XML
archiveapplets in HTML and XML
codeBaseapplets in HTML and XML
formatFlash HTML XML
heightFlash XML
id 
methodFlash HTML XML
nameFlash HTML XML
onErrorFlash HTML
onLoadHTML XML
onResetHTML XML
onSubmitFlash HTML XML
onSuccessHTML
preloaderFlash
preserveDataHTML XML
scriptSrcFlash HTML XML
skinFlash XML
styleHTML, Flash, XML
timeoutFlash
widthFlash XML
wModeFlash

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.

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>