has been around for a long time. It started life as a Java applet, then in CFMX7 we added a Flash grid and XML generation, and in Scorpio we plan on adding an Ajax powered DHTML grid. You'll be able to pass a query to the grid as you did previously, like this: SELECT * FROM myTable ... But where things get really interesting are when data is retrieved asynchronously (in much the same way as in the auto-suggest example I mentioned earlier this week). Look at this example: The bind attribute specifies the CFC and method to be invoked, and the current page, page size, and sort information get passed to the CFC method which then returns the appropriate query data. And yes, this does mean that paging is supported, the grid contains paging controls and when you move through pages (or resort columns) the CFC method is asynchronously invoked and the grid is updated accordingly. And of course there is more, for example: Of course, this is all subject to change. :-)
Scorpio's Ajax Data Grid
13 Comments
M
Michael White
my only gripe with grids in coldfusion (compared with microsoft Access) is that you can't include a combo-box in your grid... is this limitation going to be addresses in Scorpio?
D
Dan
Looks really appealing! I would be learning/using this tag today if I had the chance.
I *hope* that there will be support for a stripeRowClass attribute to support CSS classes rather than hard coding the color into the CF code with stripeRowColor.
T
excellent!
what a great way to have a reason to start using this TAG.
@adam, i think you might have not seen the light before because
it was always a weird, cumbersome THING.
now, it will be dhtml (ie. table, like normal html stuff :))
and like what you are used to seeing.
*i think*
anyway, it sounds DELICIOUS
good stuff.
A
Adam Reynolds
Sorry but in all my 7 years of using CF I don't think I've ever found a use for cfgrid.
Maybe I've missed a trick with this.
*shrug*
K
Ken Dunnington
Looks good! I just finished my first Flex app this weekend, and it's nice to see that Flex, CF and Spry all seem to be converging to become the uber-platform for web (and of course desktop when you throw Apollo into the mix) development.
R
Looks awesome. I'm excited for it. Agreed, now cfgrid will finally have a (real) use!
B
Alan, this example required ColdFusion 8 <CFGRID>, it won't work with earlier versions.
--- Ben
A
It doesn't work .... see error.
Attribute validation error for tag CFGRID.
The tag does not allow the attribute(s) PAGESIZE,BIND. The valid attribute(s) are ALIGN,APPENDKEY,AUTOWIDTH,BGCOLOR,BOLD,COLHEADERALIGN,COLHEADERBOLD,COLHEADERFONT,COLHEADERFONTSIZE,COLHEADERITALIC,COLHEADERS,COLHEADERTEXTCOLOR,DELETE,DELETEBUTTON,ENABLED,FONT,FONTSIZE,FORMAT,GRIDDATAALIGN,GRIDLINES,HEIGHT,HIGHLIGHTHREF,HREF,HREFKEY,HSPACE,INSERT,INSERTBUTTON,ITALIC,LABEL,MAXROWS,NAME,NOTSUPPORTED,ONBLUR,ONCHANGE,ONERROR,ONFOCUS,ONVALIDATE,PICTUREBAR,QUERY,ROWHEADERALIGN,ROWHEADERBOLD,ROWHEADERFONT,ROWHEADERFONTSIZE,ROWHEADERITALIC,ROWHEADERS,ROWHEADERTEXTCOLOR,ROWHEADERWIDTH,ROWHEIGHT,SELECTCOLOR,SELECTMODE,SORT,SORTASCENDINGBUTTON,SORTDESCENDINGBUTTON,STYLE,TARGET,TEXTCOLOR,TOOLTIP,VISIBLE,VSPACE,WIDTH.
The error occurred in D:aphamBusinessContinentsNewsWebRootmyNews.cfm: line 141
139 : </cfformgroup>
140 : <cfformgroup type="page" label="Last Week">
141 : <cfgrid name="lastWeekNews" query="getTodayNews"
142 : format="html"
143 : pageSize="10"
C
I am running into an error that has me scratching my head. I have followed a number of examples and keep running into the same issue where debug states "error:http: Error invoking CFC /park.cfc : Not Found"
The files are in the same directory and I have tried putting the CFC in a different location and it comes back with a completed different error " Could not find the ColdFusion Component or Interface". Anyhow, what follows is the code being used.
I have also connected to it via CFINVOKE without any problem.
--------------------------------------
----park.cfm ---
<cfform name="parkForm" action="park.cfm" method="post">
<cfgrid format="html" name="parkGrid" pagesize="5" selectmode="browse"
bind="cfc:park.getParks(page={cfgridpage},pageSize={cfgridpagesize},gridsortcolumn= {cfgridsortcolumn},gridsortdirection={cfgridsortdirection})" delete="yes" deletebutton="Remove" insert="yes" insertbutton="Insert" >
<cfgridcolumn name="site_name" width="300" header="site_name" />
<cfgridcolumn name="site_desc" width="180" header="site_desc" />
<cfgridcolumn name="site_url" width="120" header="site_url" />
<cfgridcolumn name="active" width="60" header="active" />
</cfgrid>
<cfinput name="submitBut" type="submit" value="Submit">
</cfform>
----------------------------------------
park.cfc (same directory)
<cfcomponent bindingname="park">
<cffunction name="getParks" access="remote" returntype="struct">
<cfargument name="page" required="true" />
<cfargument name="pageSize" required="true" />
<cfargument name="gridsortcolumn" required="true" />
<cfargument name="gridsortdirection" required="true" />
<cfif arguments.gridsortcolumn eq "">
<cfset arguments.gridsortcolumn = "site_name" />
<cfset arguments.gridsortdirection = "asc" />
</cfif>
<cfquery name="parks" datasource="lythoweb">
select site_name , site_desc, site_url, active
from portfolio
order by #arguments.gridsortcolumn# #arguments.gridsortdirection#
</cfquery>
<cfreturn queryconvertforgrid(parks, page, pagesize) />
</cffunction>
</cfcomponent>
-----------------------------------------------------------
Error CfDebug
error:http: Error invoking CFC /park.cfc : Not Found
info:widget: Created grid, id: parkGrid
info:http: HTTP GET /park.cfc?method=getParks&returnFormat=json&argumentCollection=%7B%22PAGE%22%3A1%2C%22PAGESIZE%22%3A5%2C%22GRIDSORTCOLUMN%22%3A%22%22%2C%22GRIDSORTDIRECTION%22%3A%22%22%7D&_cf_nodebug=true&_cf_nocache=true&_cf_clientid=D1E68692B55A6D1428BFA54553F597AE&_cf_rc=0
info:http: Invoking CFC: /park.cfc , function: getParks , arguments: {"PAGE":1,"PAGESIZE":5,"GRIDSORTCOLUMN":"","GRIDSORTDIRECTION":""}
info:LogReader: LogReader initialized
info:global: Logger initialized
------------------------------------
This is pretty basic and is based on an example I found.. Has anyone else run it into this issue?
Thanks,
~Chris
W
I'm having some trouble getting the pagesize attribute to work with cfgrid. I'm not using a binding, just a simple query, but it's not paging the results.
Here is the code:
<cfgrid name="comments"
width="200%"
height="360"
format="html"
query="comments"
insert="yes"
pagesize="10"
delete="no"
autowidth="yes"
selectmode="edit">
Any clues?? Do you need to use a binding to use pagesize? (I'm reading through your book btw)
D
Derek
I know this is a little old, but I am having the same issue. I can't get pagesize to work with a query result set.
J
John
"I can't get pagesize to work with a query result set."
Ditto. Any ideas...?
M
I can't seem to get pageSize to work either. Its stuck on 7