你可以建立允许用户进行数据编辑的网格，根据用户的编辑结果，你可以用CFQUERY标签对数据源进行修改，也可以使用CFGRIDUPDATE标签，将用户对网格数据的编辑直接写到数据库中。
单元格中的数据可以被编辑，一行数据可以被插入，删除或更新，但在此之前。你需要在CFGRID中指定SELECTMODE=“EDIT”来允许编辑数据，还许要允许INSERT属性和DELETE属性（将其值设为“YES”）。完成这些设置后，该网格即可用来对数据源进行操作。
使用可更新网格对ODBC数据源进行修改的方法主要有两种。你可以建立一个文件，将CFGRID表单变量传递给该文件，在该文件中用CFQUERY标签执行对数据源的更新，另一种方法是将网格编辑结果传递给一个包含CFGRIDUPDATE标签的文件，该标签直接将编辑结果写入数据源，虽然使用CFQUERY可以实现对数据源的完全控制，但对不需要复杂控制的操作来说，CFGRIDUPOATE使用起来更加简单。
编辑网格中的数据
设置SELECTMODE=“EDIT”后，用户即可编辑网格中的数据。用户可以点击一个单元格，然后用简单的编辑操作改单元格中的数据。设置INSERT=“YES”和DELETE=“YES”后，用户可以选择一行数据并删除之，也可以选择一行数据，在该位置插入一个新行。当一个包含CFGRID标签的CFFORM被提交时，数据的修改被记录在几个一维数组中，你可以象引用其它的ColdFusion数组一样引用这些数组。
下列的这些数组用来跟踪网格数据的修改：
|
用于存储单元格编辑信息的数组 |
|
数组 |
描述 |
|
gridname.colname[row_index] |
存储被编辑单元格的新值 |
|
gridname.Original.colname[row_index] |
存储被编辑单元格的原始值 |
|
gridname.RowStatus.Action[row_index] |
存储对单元格的编辑类型 |
例如，有一个网格“mygrid”，包含两个可显示字段CO11和CO12，一个隐藏字段CO13。当用户选择并修改了某一行中的数据时，则下列数组被创建，用于保存被更新，插入或删除的行的原始数据和新数据。
mygrid.col1[ row_index ]
mygrid.col2[ row_index ]
mygrid.col3[ row_index ]
mygrid.original.col1[ row_index ]
mygrid.original.col2[ row_index ]
mygrid.original.col3[ row_index ]
其中row_index是数组的索引值。
如果用户修改了CO12字段的某个单元格，你可以用如下的方式引用编辑操作类型、该单元格的原始值，以及编辑后的新值：
<CFSET edittype = mygrid.RowStatus.Action[1]><BR>
<CFSET new_value = mygrid.col2[1]><BR>
<CFSET old_value = mygrid.original.col2[1]>
为INSERT按钮和DELETE按钮指定替代文本
如果你希望可更新网格的插入和删除按钮使用不同于“Insert”和“Delete”的文本，你可以在INSERTBUTTON属性和DELETEBUTTON属性中指定替代的文本。
对网格数据排序
CFGRID标签的SORT属性用于允许在网格控件中包含排序按钮，允许排序后，排序按钮会被自动添加到网格中。点击该按钮时，网格数据会按选中的字段进行排序。ColdFusion将字段值视为文本或数字而进行排序。
下列的CFGRID属性用于定义与排序有关的各个选项
·
PICTUREBAR——当设置为YES时，排序按钮是一个图形按钮，而非文本按钮。
·
SORTASCENDINGBUTTON——用于指定升序排序按钮的显示文本，缺省值为“A® Z”
·
SORTDESECNDINGBUTTON——用于指定降序排序按钮的显示文本，缺省值为“Z¬ A”
注意：用户在点击排序按钮之前必须首先选择一个字段。
例子：可编辑的网格
下面的例子演示了可更新网格的使用，在这个例子中，SELECTMODE属性被设置为“Edit”，INSERT属性和DELETE属性被设置为“yes”。当这个表单被提交时，handle_grid.cfm文件被调用，该文件显示编辑操作的类型，并直接对数据源执行相应的更新、删除或插入等操作。
Grid.cfm
<HTML>
<HEAD>
<TITLE>Simple Update Grid Example</TITLE>
</HEAD>
<CFQUERY NAME="CourseList"
DATASOURCE="cfsnippets">
SELECT * FROM Courses
</CFQUERY>
<BODY BGCOLOR="#FFFFFF">
<CFFORM NAME="GridForm"
ACTION="handle_grid.cfm">
<CFGRID NAME="course_grid"
HEIGHT=170
WIDTH=400
HSPACE=10
VSPACE=6
ALIGN="RIGHT"
SELECTCOLOR="white"
SELECTMODE="edit"
ROWHEADERS="YES"
ROWHEADERWIDTH=25
ROWHEADERALIGN="right"
COLHEADERS="YES"
QUERY="CourseList"
GRIDDATAALIGN="left"
BGCOLOR="green"
INSERT="YES"
DELETE="YES"
SORT="YES"
MAXROWS=60>
<CFGRIDCOLUMN NAME="course_id"
HEADER="Course ID"
WIDTH=80
ITALIC="NO"
HEADERALIGN="center"
HEADERITALIC="NO"
HEADERBOLD="YES"
DISPLAY="NO">
<CFGRIDCOLUMN NAME="number"
HEADER="Course ##"
WIDTH=80
ITALIC="NO"
HEADERALIGN="center"
HEADERITALIC="NO"
HEADERBOLD="YES"
DISPLAY="YES"
SELECT="YES">
<CFGRIDCOLUMN NAME="description"
HEADER="Description"
WIDTH=240
ITALIC="No"
HEADERALIGN="center"
HEADERITALIC="No"
HEADERBOLD="Yes"
BOLD="Yes"
ITALIC="Yes"
DISPLAY="Yes">
</CFGRID>
<!---
<H3>Editable Grid</H3>
This is a grid that is populated <BR>
from a query. The select mode is <BR>
update. The description column<BR>
is presented in Bold and Italic.<BR><BR> --->
<INPUT TYPE="Submit" VALUE=" Push me... "> <BR>
</CFFORM>
</BODY>
</HTML>
这个例子的显示结果类似于下图：
你对网格数据的修改将反映在数据源cfsnippets的表Courses中，你可以在Studio中查开这个表。
Handle_grid.cfm
<HTML>
<HEAD>
<TITLE>Catch submitted grid values</TITLE>
</HEAD>
<BODY>
<H3>Grid values for FORM.Course_grid row updates</H3>
<CFIF IsDefined("form.course_grid.rowstatus.action")>
<CFLOOP INDEX = "Counter" FROM = "1" TO =
#ArrayLen(form.course_grid.rowstatus.action)#>
<CFOUTPUT>
The row action for #Counter# is:
#form.course_grid.rowstatus.action[Counter]#
<BR><BR>
</CFOUTPUT>
<CFIF form.course_grid.rowstatus.action[Counter] IS "D">
<CFQUERY NAME="InsertNewCourse"
DATASOURCE="cfsnippets">
DELETE from courses
WHERE
course_id=#form.course_grid.original.course_id[Counter]#
</CFQUERY>
<CFELSEIF form.course_grid.rowstatus.action[Counter] IS
"U">
<CFQUERY NAME="UpdateExistingCourse"
DATASOURCE="cfsnippets">
UPDATE courses
SET
description=’#form.course_grid.description[Counter]#’,
"Number"=’#form.course_grid.number[Counter]#’
WHERE
course_id=#form.course_grid.original.course_id[Counter]#
</CFQUERY>
<CFELSEIF form.course_grid.rowstatus.action[Counter] IS
"I">
<CFQUERY NAME="InsertNewCourse"
DATASOURCE="cfsnippets">
INSERT into courses
("Number", description)
VALUES (‘#form.course_grid.number[Counter]#’,
‘#form.course_grid.description[Counter]#’)
</CFQUERY>
</CFIF>
</CFLOOP>
</CFIF>
</BODY>
</HTML>
使用CFGRIDUPDATE
CFGRIDUPDATE标签可以根据CFGRID的内容直接对数据源进行更新，你不需要在CFQUERY中使用SQL语句来完成数据的更新，CFGRIDUPDATE标签可以直接取得CFGRID中的数据编辑信息，自动完成整个处理过程。
在前面的例子中，来自可编辑网格的数据被传给一个文件，该文件在CFIF结构中使用CFQUERY标签完成对数据源的更新，而在许多情况下，用CFGRIDUPDATE标签使程序更加简单。
例如，下面的代码从一个名为“Courses”的网格接收数据，对数据源进行更新。
<CFGRIDUPDATE GRID="Courses"
DATASOURCE="CF 4.0 Examples"
TABLENAME="Courses"
KEYONLY="NO">
当表单被提交时，存储有关数据修改信息的数组被传递给CFGRIDUPDATE标签，此标签根据这些数组的内容构造必要的SQL语句来完成数据的更新，从而你不必要自己构造复杂的SQL语句，非常方便。
KEYONLY属性
CFGRIDUPDATE标签包含一个KEYONLY属性，该属性可以强制ColdFusion对被更新字段的原始值与表中的字段值进行比较。如果两者相同，也就是说，在网格数据被编辑的过程的没有其它进程曾改变过数据库中的数据，则更新成功，如果两者不相同，则产生错误。当你要确保没有其它进程曾更新过该数据时，应设置KEYONLY=“NO”。如果不可能有其它进程更改该数据，可设置KEYONLY=“YES”。
在网格中嵌入图象
CFGRIDROW标签使你能够在网格单元格中放入图象，首先你要在CFGRIDCOLUMN标签中设置TYPE=“IMAGE”，以告诉ColdFusion将该列数据理解为一个图象。你可以使用ColdFusion的内建图象（与CFTREEITEM相同），也可以指定自选的图象。下面的这段代码演示了如何在网格中嵌入ColdFusion的内建图象。
...
<CFGRIDCOLUMN NAME="dept_name"
HEADER="Dept"
SELECT="NO"
DATAALIGN="Center"
WIDTH=40
TYPE=IMAGE>
<CFGRIDCOLUMN NAME="emp_lname"
HEADER="Name">
<CFGRIDROW DATA="folder,Jones">
<CFGRIDROW DATA="document,Smith">
...
注意，在CFGRIDROW中，用逗号将显示在第一列的图象名与显示在第二列的数据分隔开。
在网格中使用自己的图象
当你想用自己的图象代替ColdFusion的内建图象时，你需要指定该图象所在目录的相对路径，以及图象文件名。指定图象文件的相对路径时，要注意该路径是相对于支持CFGRID控件的Java类的路径，它通常是：
Webroot\cfide\classes\images
因此你可以指定一个此路径的相对路径，或者将要使用的图象文件放在cfide\classes\images目录下，然后即可直接使用文件名而无须指定路径，就象使用内建图象一样。
在下面的代码段中，CFGRIDROW标签使用了webroot\images目录下的图象文件：
...
<CFGRIDCOLUMN NAME="dept_name"
HEADER="Dept"
SELECT="NO"
DATAALIGN="Center"
WIDTH=40
TYPE=IMAGE>
<CFGRIDCOLUMN NAME="emp_lname"
HEADER="Name">
<CFGRIDROW DATA="..\..\..\images\icon1.gif,Jones">
<CFGRIDROW DATA="..\..\..\images\icon2.gif,Smith"> |
