På denne siden
- About ColdFusion forms
- Enable the ColdFusion enhancements
- Create ColdFusion forms
- Insert ColdFusion form controls
- Insert ColdFusion text fields
- Insert ColdFusion hidden fields
- Insert ColdFusion text areas
- Insert ColdFusion buttons
- Insert ColdFusion check boxes
- Insert ColdFusion radio buttons
- Insert ColdFusion select boxes
- Insert ColdFusion image fields
- Insert ColdFusion file fields
- Insert ColdFusion date fields
- Modify ColdFusion form controls
- Validate ColdFusion form data
Merk:
Support for ColdFusion is removed in Dreamweaver CC and later.
ColdFusion forms provide you with several built-in mechanisms to validate form data. For example, you can check to make sure a user has entered a valid date. Some form controls have additional features. Several do not have HTML counterparts, and others directly support dynamically populating the control from data sources.
Dreamweaver provides a number of enhancements for ColdFusion developers who use ColdFusion MX 7 or later as their development server. These enhancements include more Insert panel buttons, menu items, and Property inspectors so that you can rapidly build and set the properties of ColdFusion forms. You can also generate code that validates the information provided by site visitors. For example, you can check that the e‑mail address provided by a user contains the @ symbol, or that a required text field contains a certain type of value.
Some of these enhancements require that you define a computer running ColdFusion MX 7 or later as a testing server for Dreamweaver. For example, the Property inspectors for form controls are available only if you specify the correct testing server.
You define a testing server only once. Dreamweaver then automatically detects the testing server version and makes the enhancements available if it detects ColdFusion.
You can use a number of Insert panel buttons, menu items, and Property inspectors to rapidly create ColdFusion forms and set their properties in Dreamweaver.
Merk:
These enhancements are available only if you have access to a computer running ColdFusion MX 7 or later.
-
Ensure that the form is still selected, and then use the Property inspector to set any of the following form properties.
Method
Lets you define the method that the browser uses to send the form data to the server:
POST
Sends the data using the HTTP post method; this method sends the data in a separate message to the server.
GET
Sends the data using the HTTP get method, placing the form field contents in the URL query string.
Merk:
Encoding type does not refer to character encoding. This attribute specifies the content type used to submit the form to the server (when the value of method is post). The default value for this attribute is application/x-www-form-urlencoded.
Format
Determines what kind of form is created:
HTML
Generates an HTML form and sends it to the client. The cfgrid and cftree child controls can be in Flash or applet format.
Flash
Generates a Flash form and sends it to the client. All controls are in Flash format.
XML
Generates XForms XML and puts the results in a variable with the ColdFusion form name. Does not send anything to the client. The cfgrid and cftree child controls can be in Flash or applet format.
Flash/XML Skin
Lets you specify a halo color to stylize the output. The theme determines the color used for highlighted and selected elements.
Preserve Data
Determines whether to override the initial control values with submitted values when the form posts to itself.
If False, values specified in the control tag attributes are used.
If True, submitted values are used.
Scripts src
Specifies the URL, relative to the web root, of the JavaScript file that contains client-side code used by the tag and its child tags. This attribute is useful if the file is not in the default location. This attribute may be required in some hosting environments and configurations that block access to the /CFIDE directory. The default location is set in the ColdFusion Administrator; by default, it is /CFIDE/scripts/cfform.js.
-
If you’re creating an HTML-based form, you can use line breaks, paragraph breaks, preformatted text, or tables to format your forms. You cannot insert a ColdFusion form in another ColdFusion form (that is, you cannot overlap tags), but you can include more than one ColdFusion form in a page.
If you’re creating a Flash-based form, use Cascading Style Sheets (CSS) styles to lay out your form. ColdFusion ignores any HTML in the form.
Remember to label the ColdFusion form fields with descriptive text to let users know what they are responding to. For example, create a “Type your name label” to request name information.
Use the Insert panel or Insert menu to quickly insert ColdFusion form controls into a ColdFusion form. You need to create a blank ColdFusion form before inserting controls in it.
Merk:
These enhancements are only available if you have access to a computer running ColdFusion MX 7 or later.
You can visually insert a ColdFusion text field or password field into your form, and then set its options.
Merk:
This enhancement is available only if you have access to a computer running ColdFusion MX 7 or later.
To set the options of a ColdFusion text or password field, set any of the following options in the CFTextField Property inspector:
Value
Lets you specify text to be displayed in the field when the page first opens in a browser. The information can either be static or dynamic.
To specify a dynamic value, click the lightning bolt icon beside the Value box and select a recordset column in the Dynamic Data dialog box. The recordset column supplies a value to the text field when you view the form in a browser.
Text Mode
Lets you switch between the standard text input field and the password input field. The attribute modified by this control is type.
Mask
Lets you specify a mask for your requested text. You use this property to validate the user input. The mask format is composed of A, 9, X and ? characters.
Merk:
The mask attribute is ignored for the cfinput type="password" tag.
Pattern
Lets you specify a JavaScript regular expression pattern to validate input. Omit leading and trailing slashes. For more information, see the ColdFusion documentation.
Required
Lets you specify whether the text field must contain data before the form is submitted to the server.
You can visually insert a ColdFusion hidden field into your form and set its properties. Use hidden fields to store and submit information that the user does not enter. The information is hidden from the user.
Merk:
This enhancement is available only if you have access to a computer running ColdFusion MX 7 or later.
-
Value
Lets you specify a value for the hidden field. The data can either be static or dynamic.
To specify a dynamic value, click the lightning bolt icon beside the Value box and select a recordset column in the Dynamic Data dialog box. The recordset column supplies a value to the text field when you view the form in a browser.
Label
Lets you specify a label for the control. This property is ignored by the ColdFusion server at run time.
Pattern
Lets you specify a JavaScript regular expression pattern to validate input. Omit leading and trailing slashes. For more information, see the ColdFusion documentation.
Height
Lets you specify the height of the control, in pixels. This property is ignored by the ColdFusion server at run time.
Width
Lets you specify the width of the control, in pixels. This property is ignored by the ColdFusion server at run time.
Size
Lets you specify the size of the control. This property is ignored by the ColdFusion server at run time.
You can visually insert a ColdFusion text area into your form and set its properties. A text area is an input element that consists of multiple lines of text.
Merk:
This enhancement is available only if you have access to a computer running ColdFusion MX 7 or later.
-
Required
Lets you specify whether the user must enter data in the field (checked) or not (unchecked).
Initial Value
Lets you specify text to display in the text area when the page is initially opened in a browser.
Style
Lets you specify a style for the control. For more information, see the ColdFusion documentation.
Height
Lets you specify the height of the control, in pixels. This property is ignored by the ColdFusion server at run time.
You can visually insert a ColdFusion button into your form and set its properties. ColdFusion buttons control ColdFusion form operations. Buttons can be used to submit ColdFusion form data to the server or to reset the ColdFusion form. Standard ColdFusion buttons are typically labeled Submit, Reset, or Send. You can also assign other processing tasks that you defined in a script. For example, the button might calculate the total cost of selected items based on assigned values.
Merk:
This enhancement is available only if you have access to a computer running ColdFusion MX 7 or later.
You can visually insert a ColdFusion check box into your form and set its properties. Use check boxes to let users select more than one option from a set of options.
Merk:
This enhancement is available only if you have access to a computer running ColdFusion MX 7 or later.
-
Initial State
Lets you specify whether the check box is checked when the page first opens in a browser.
Pattern
Lets you specify a JavaScript regular expression pattern to validate input. Omit leading and trailing slashes. For more information, see the ColdFusion documentation.
Height
Lets you specify the height of the control, in pixels. This property is ignored by the ColdFusion server at run time.
Width
Lets you specify the width of the control, in pixels. This property is ignored by the ColdFusion server at run time.
Size
Lets you specify the size of the control. This property is ignored by the ColdFusion server at run time.
You can visually insert a ColdFusion radio button into your form and set its properties. Use radio buttons when you want users to select only one choice from a set of options. Radio buttons are typically used in groups. All radio buttons in a group must have the same name.
Merk:
This enhancement is available only if you have access to a computer running ColdFusion MX 7 or later.
-
Initial State
Lets you specify whether the radio button is checked when the page first opens in a browser.
Pattern
Lets you specify a JavaScript regular expression pattern to validate input. Omit leading and trailing slashes. For more information, see the ColdFusion documentation.
Height
Lets you specify the height of the control, in pixels. This property is ignored by the ColdFusion server at run time.
Width
Lets you specify the width of the control, in pixels. This property is ignored by the ColdFusion server at run time.
Size
Lets you specify the size of the control. This property is ignored by the ColdFusion server at run time.
You can visually insert a ColdFusion select box into your form and set its properties. A select box lets a visitor select one or more items from a list. Select boxes are useful when you have a limited amount of space, but need to display many items. They’re also useful when you want to control the values returned to the server. Unlike text fields, where users can type anything they want, including invalid data, with select boxes, you can set the exact values returned by a menu.
You can insert two types of select boxes into a form: a menu that “drops down” when the user clicks it, or a menu that displays a scrollable list of items that the user can select.
Merk:
This enhancement is available only if you have access to a computer running ColdFusion MX 7 or later.
-
Type
Lets you choose between a pop‑up menu or a list. If you select the list type, the List Height and Allow Multiple List Selections options become available.
List Height
Lets you specify the number of lines to display in the list menu. Available only if you select the list type.
Allow Multiple List Selections
Lets you specify whether the user can select more than one option from the list at a time. Available only if you select the list type.
Initially Selected
Lets you specify which option is selected by default. You can select more than one option if you selected the Allow Multiple List Selections option.
Recordset
Lets you specify the name of the ColdFusion query you want to use to populate the list or menu.
Display Column
Lets you specify the recordset column to supply the display label of each list element. Used with Recordset property.
Value Column
Lets you specify the recordset column to supply the value of each list element. Used with the Recordset property.
Flash Height
Lets you specify the height of the control, in pixels. This property is ignored by the ColdFusion server at run time.
Flash Width
Lets you specify the width of the control, in pixels. This property is ignored by the ColdFusion server at run time.
Message
Specifies the message to be displayed if the Required property is set to Yes and the user failed to make a selection before submitting the form.
You can visually insert a ColdFusion image field into your form and set its options. Use image fields to make custom buttons.
Merk:
This enhancement is available only if you have access to a computer running ColdFusion MX 7 or later.
-
In the CFForm category of the Insert panel, click the CF Image Field icon. Browse to select the image to insert, and click OK. Alternatively, you can enter the path of the image file in the Src box.
Merk:
If the image is outside the site root folder, you should copy the image to the root folder. Images outside the root folder might not be accessible when you publish the site.
-
Edit Image
Opens the image in your default image editor.
To define a default image editor, select Edit > Preferences > File Types / Editors. Otherwise, the Edit Image button does not perform any action.
Pattern
Lets you specify a JavaScript regular expression pattern to validate input. Omit leading and trailing slashes. For more information, see the ColdFusion documentation.
Size
Lets you specify the size of the control. This property is ignored by the ColdFusion server at run time.
You can visually insert a ColdFusion file field into your form and set its properties. Use a file field to let users select a file from their computer, such as a word processing document or a graphics file, and upload it to the server. A ColdFusion file field looks like other text fields, except it also has a Browse button. Users can manually enter the path to the file they want to upload, or use the Browse button to locate and select the file.
File fields require that you use the POST method to transmit files from the browser to the server. The file is posted to the address that you specify in the form’s Action box. Contact your server administrator to confirm that anonymous file uploads are allowed before using a file field in your form.
File fields also require that the form encoding be set to multipart/form. Dreamweaver sets this automatically when you insert a file field control.
Merk:
This enhancement is available only if you have access to a computer running ColdFusion MX 7 or later.
-
Select the file field on the page and set any of the following properties in the Property inspector:
Pattern
Lets you specify a JavaScript regular expression pattern to validate input. Omit leading and trailing slashes. For more information, see the ColdFusion documentation.
Height
Lets you specify the height of the control, in pixels. This property is ignored by the ColdFusion server at run time.
Width
Lets you specify the width of the control, in pixels. This property is ignored by the ColdFusion server at run time.
Although you can’t visually insert a ColdFusion date field in Dreamweaver, you can visually set its properties. A ColdFusion date field is a special type of text field that lets users select a date from a pop‑up calendar to insert it in the text field.
Merk:
This enhancement is available only if you have access to a computer running ColdFusion MX 7 or later.
-
Switch to Design view, select the date field on the page, and then set any of the following options in the Property inspector:
Value
Lets you specify a date to be displayed in the field when the page first opens in a browser. The date can either be static or dynamic.
To specify a dynamic value, click the lightning bolt icon beside the Value box and select a recordset column in the Dynamic Data dialog box. The recordset column supplies a value to the date field when you view the form in a browser.
Pattern
Lets you specify a JavaScript regular expression pattern to validate input. Omit leading and trailing slashes. For more information, see the ColdFusion documentation.
You can visually change the properties of ColdFusion form controls whether you’re working in Design view or Code view.
Merk:
This enhancement is available only if you have access to a computer running ColdFusion MX 7 or later.
You can build ColdFusion forms in Dreamweaver that check the contents of specified fields to ensure the user entered the correct data type.
Merk:
This enhancement is available only if you have access to a computer running ColdFusion MX 7 or later.
-
The lower part of each input Property inspector contains controls to help you define the specific validation rule. For example, you might want to specify that a text field should contain a telephone number. To do this, select Telephone from the Value pop‑up menu in the Property inspector. You can also specify when to validate from the Validate At pop‑up menu.
Innlegg på Twitter™ og Facebook dekkes ikke av Creative Commons-vilkår.