Adobe ColdFusion 8

Creating data grids with the cfgrid tag

The cfgrid tag creates a cfform grid control that resembles a spreadsheet table and can contain data populated from a cfquery tag or from other sources of data. As with other cfform tags, the cfgrid tag offers a wide range of data formatting options, as well as the option of validating user selections with a JavaScript validation script.

You can also perform the following tasks with a cfgrid tag:

  • Sort data in the grid alphanumerically.
  • Update, insert, and delete data.
  • Display images in the grid.

Note: Flash format grids support a subset of the features available in applet format grids. For details on features supported in each format, see the cfgrid tag in the CFML Reference.

Users can sort the grid entries in ascending order by double-clicking any column header. Double-clicking again sorts the grid in descending order. In applet format, you can also add sort buttons to the grid control.

When users select grid data and submit the form, ColdFusion passes the selection information as form variables to the application page specified in the cfform action attribute.

Just as the cftree tag uses the cftreeitem tag, the cfgrid tag uses the cfgridcolumn and cfgridrow tags. You can define a wide range of row and column formatting options, as well as a column name, data type, selection options, and so on. You use the cfgridcolumn tag to define individual columns in the grid or associate a query column with a grid column.

Use the cfgridrow tag to define a grid that does not use a query as the source for row data. If a query attribute is specified in the cfgrid tag, the cfgridrow tags are ignored.

The cfgrid tag provides many attributes that control grid behavior and appearance. This chapter describes only the most important of these attributes. For detailed information on these attributes, see the cfgrid tag in the CFML Reference.