130 likes | 283 Views
ColdFusion :. Data grids with CFGRID. Java applet-based CFFORM control Resembles a spreadsheet table Data populated by a CFQUERY or other sources Allows alphanumeric sorting of data in grid updates, inserts, and deletes
E N D
Data grids with CFGRID • Java applet-based CFFORM control • Resembles a spreadsheet table • Data populated by a CFQUERY or other sources • Allows • alphanumeric sorting of data in grid • updates, inserts, and deletes • Selection information passed to application page in CFFORM ACTION attribute
Data grids with CFGRID • Arrays Used to Store Grid Cell Edit Information Array referenceDescription gridname.colname [ row_index ] Stores the new value of an edited grid cell gridname. Original.colname [ row_index ] Stores the originalvalue of the edited grid cell gridname.RowStatus.Action [ row_index ] Stores the edit type made against the edited grid cell.
Code for creating the grid <HTML> <HEAD> <TITLE>Simple Update Grid Example</TITLE> </HEAD> <CFQUERY NAME="customerList" DATASOURCE="mydb"> SELECT * FROM customer </CFQUERY> <BODY> <DIV ALIGN="CENTER"> <H1>Customer records in an Editable Grid</H1> <BR> <BR> <CFFORM NAME="GridForm" ACTION="handle_grid.cfm">
<CFGRID NAME="customer_grid" HEIGHT=170 WIDTH=550 HSPACE=10 VSPACE=6 ALIGN="CENTER" SELECTCOLOR=”white" SELECTMODE="edit" ROWHEADERS="YES" ROWHEADERWIDTH=25 ROWHEADERALIGN="right" COLHEADERS="YES" QUERY="customerList" GRIDDATAALIGN="left" BGCOLOR="yellow" INSERT="YES" DELETE="YES" SORT="YES" PICTUREBAR ="YES" MAXROWS=60> <CFGRIDCOLUMN NAME="custnumb" HEADER="Number" WIDTH=50 ITALIC="NO" HEADERALIGN="center" HEADERITALIC="NO" HEADERBOLD="YES" DISPLAY="YES"> <CFGRIDCOLUMN NAME="custname" HEADER="Name" WIDTH=120 ITALIC="NO" HEADERALIGN="center" HEADERITALIC="NO" HEADERBOLD="YES" DISPLAY="YES" SELECT="YES"> Code for creating the grid contd.
<CFGRIDCOLUMN NAME="address" HEADER="Address" WIDTH=140 ITALIC="NO" HEADERALIGN="center" HEADERITALIC="NO" HEADERBOLD="YES" DISPLAY="YES" SELECT="YES"> <CFGRIDCOLUMN NAME="balance" HEADER="Balance" WIDTH=70 NUMBERFORMAT=9999.99 ITALIC="NO" HEADERALIGN="center" HEADERITALIC="NO" HEADERBOLD="YES" DISPLAY="YES" SELECT="YES"> <CFGRIDCOLUMN NAME="credlim" HEADER="Max Credit" WIDTH=70 ITALIC="NO" NUMBERFORMAT=9999.99 HEADERALIGN="center" HEADERITALIC="NO" HEADERBOLD="YES" DISPLAY="YES" SELECT="YES"> <CFGRIDCOLUMNNAME="slsrnumb" HEADER="Rep##" WIDTH=50 ITALIC="NO" HEADERALIGN="center" HEADERITALIC="NO" HEADERBOLD="YES" DISPLAY="YES" SELECT="YES"> </CFGRID> <BR> <INPUT TYPE="Submit" VALUE="COMMIT"> <BR> </CFFORM> </DIV> </BODY> </HTML> Code for creating the grid contd.
Grid handler <HTML> <HEAD> <TITLE>Catch submitted grid values</TITLE> </HEAD> <BODY> <H3>Grid values for updating CUSTOMER table</H3> <CFIF IsDefined("form.customer_grid.rowstatus.action")> <CFLOOP INDEX = "Counter" FROM = "1" TO = #ArrayLen(form.customer_grid.rowstatus.action)#> <CFIF form.customer_grid.rowstatus.action[Counter] IS "D"> <CFQUERY NAME="InsertNewCustomer" DATASOURCE="mydb"> DELETE from customer WHERE custnumb=#form.customer_grid.original.custnumb[Counter]# </CFQUERY> <CFOUTPUT> Customer #form.customer_grid.original.custnumb[Counter]# deleted <br> </CFOUTPUT>
Grid handler contd. <CFELSEIF form.customer_grid.rowstatus.action[Counter] IS "U"> <CFQUERY NAME="UpdateExistingCustomer" DATASOURCE="mydb"> UPDATE customer SET custname='#form.customer_grid.custname[Counter]#' , address='#form.customer_grid.address[Counter]#', balance='#form.customer_grid.balance[Counter]#', credlim='#form.customer_grid.credlim[Counter]#', slsrnumb='#form.customer_grid.slsrnumb[Counter]#' WHERE custnumb=#form.customer_grid.original.custnumb[Counter]# </CFQUERY> <CFOUTPUT> Customer #form.customer_grid.original.custname[Counter]# updated <br> </CFOUTPUT> <CFELSEIF form.customer_grid.rowstatus.action[Counter] IS "I">
Grid handler contd. <CFQUERY NAME="InsertNewCustomer" DATASOURCE="mydb"> INSERT into customer VALUES ('#form.customer_grid.custnumb[Counter]#', '#form.customer_grid.custname[Counter]#', '#form.customer_grid.address[Counter]#', '#form.customer_grid.balance[Counter]#', '#form.customer_grid.credlim[Counter]#', '#form.customer_grid.slsrnumb[Counter]#') </CFQUERY> <CFOUTPUT> Customer #form.customer_grid.custname[Counter]# added <br> </CFOUTPUT> </CFIF> </CFLOOP> </CFIF> </BODY> </HTML>
Using CFGRIDUPDATE <HTML> <HEAD> <TITLE>Catch submitted grid values</TITLE> </HEAD> <BODY> <CFLOOP INDEX = "Counter" FROM = "1" TO = #ArrayLen(form.customer_grid.rowstatus.action)#> <CFOUTPUT> <CFIF form.customer_grid.rowstatus.action[counter] IS "U"> <H3>Updated '#form.customer_grid.original.custname[counter]#</H3> <CFELSEIF form.customer_grid.rowstatus.action[counter] IS "D"> <H3>Deleted '#form.customer_grid.original.custname[counter]#'</H3> <CFELSEIF form.customer_grid.rowstatus.action[counter] IS "I"> <H3>Inserted '#form.customer_grid.original.custname[counter]#'</H3> </CFIF> </ CFOUTPUT> </CFLOOP> <CFGRIDUPDATE GRID="customer_grid" DATASOURCE="mydb" TABLENAME="customer" KEYONLY="NO"> </BODY> </HTML>