View comments | RSS feed
Developing ColdFusion MX Applications with CFML Previous Up One Level Next
Building Dynamic Forms


Building drop-down list boxes

The drop-down list box that you can create in a cfform tag with cfselect is similar to the HTML select tag. However, cfselect gives you more control over user inputs, provides error handling, and, most importantly, allows you to automatically populate the selection list from a query.

You can populate the drop-down list box from a query, or using lists of option elements created by the option tag. The syntax for the option tag with cfselect is the same as for the HTML option tag.

When you populate a cfselect with data from a query, you only need to specify the name of the query that is supplying data for the cfselect and the query column name for each list element to display.

To populate a drop-down list box with query data using cfselect:

  1. Create a ColdFusion page with the following content: 
    <cfquery name="getNames"
  datasource="CompanyInfo">
  SELECT * FROM Employee
</cfquery>

<cfform name="Form1" action="submit.cfm">

  <cfselect name="employees"
    query="getNames"
    value="Emp_ID"
    display="FirstName"
    required="Yes"
    multiple="Yes"
    size="8">
  </cfselect>

  <br><input type="Submit" value="Submit">
</cfform>
  2. Save the file as selectbox.cfm and view it in your browser. The following figure shows the output of this code:

    Drop-down list box containing query data

Because the tag includes the multiple attribute, the user can select multiple entries in the list box. Also, because the value tag specifies Emp_ID, the primary key for the Employee table, Employee IDs (not first names) get passed in the Form.Employee variable to the application page specified in the cfform action attribute.

Previous Up Next

ColdFusion 9 | ColdFusion 8 | ColdFusion MX 7 | ColdFusion MX 6.1 | ColdFusion MX | Forums | Developer Center | Bug Reporting

Version 6

Comments are no longer accepted for ColdFusion MX. ColdFusion 8 is the current version.

Comments


CRJAngel said on Aug 20, 2004 at 9:14 AM :
When set to required the cfselect does not issue an error if nothingis selected. All other CFform tags are validating and I have replaced the cfform.js in the scripts folder and it is still not working. I don't see anything explicitly referring to select boxes in this form.

How do I get this to work? If I use javascript I get an error in CFform not if i just use the form tags but I want to pass the variables.

Any insights will be appreciate. Dropboxes select boxes are posing a problem with validation for me
zerointeractive said on Dec 5, 2006 at 5:07 AM :
In several sites it is reported that the "required=yes" attribute of <cfselect> tag is useless, probably due to the fact that there's a bug in cfform.js.
(See "http://www.houseoffusion.com/groups/CF-Talk/thread.cfm/threadid:2527" for a detailed explication.)

To face this problem i've found a simple workaround.

The following workaround applies to ColdFusion Server ver.7.0.2.:
1.Open the cfform.js file from:
<cf_root>/CFIDE/scripts/cfform.js
2. Find "_CF_hasValue" function;
3. Replace body of the statement "else if (obj_type == "SELECT")...." with this code:
if (obj.multiple) //ex. <select multiple="multiple" size= N ... >
{
for (i=0; i < obj.length; i++){
if (obj.options[i].selected){
return true;
}
}
}
else
if (obj[obj.selectedIndex].value!=""){
return true;
}
return false;
4. Stop & Restart Server.

 

RSS feed | Send me an e-mail when comments are added to this page | Comment Report

Current page: http://livedocs.adobe.com/coldfusion/6/Developing_ColdFusion_MX_Applications_with_CFML/dynamicForms4.htm