Sample use of the ActiveWidgets custom tag

Before calling the tag, you should reference the ActiveWidgets javascript and css file.

<cfquery datasource="#variables.dsn#" name="myblogcomments">
    select * from blog_comments
</cfquery>
 

<cf_sortabledatagrid 
   query="#myblogcomments#"
   ColumnNames="Comment ID;Blog ID;Entry ID;Date"
   DatabaseColumnNames="comment_id;blog_id;entry_id;dateformat(entry_date,'mm/dd/yy')"
   ColumnWidths="75;75;300" 
   ListSeperator=";"
   hiddenfielddataname="comment_id" 
   hiddenfieldcolumnnumber="1"
   />

Produces:

All attributes

<cf_sortabledatagrid 
   query=  Required: a query object
   ColumnNames=Required: a list of header columns to display
   DatabaseColumnNames=Required: a list of values to populate the grid.  Can use query fields and/or formating
   ColumnWidths= a list of widths for the columns.
   ListSeperator= the seperator used to pass all lists to the tag. defaults to ","
   hiddenfielddataname= the name of the hidden field to create, this gets updated whenever the selection is changed.  Defaults to the first column header name.
   hiddenfieldcolumnnumber= the column number that will be used to populate the hidden field when selected.
   customstyle= if passed, you must specify the widths in the style.  Refer to ActiveWidgets for more info.
   emptyquerymessage= the message to be displayed if the query is empty.
   id= the javascript id of the object to be created.
   rowheight = height in pixels of each row
   totalrows = total rows to be displayed before you have to scroll.   
   />

Download the Custom Tag here.
ActiveWidgets datagrid is here.