COOP Example

COOP is inspirational simplicity with separation of the designer's presentation from the developer's logic. The technology starts quickly with powerful prototyping and finishes stronger with preDOM coding and clean versatile logic. The tip of the iceberg is how COOP integrates some of the greatest AJAX libraries into a single framework.

For more information refer to http://www.coldfusioncommunity.org/group/coop

This example, coop_jqGridExample.cfm, is provided by Timothy Farrar.

<!--- First import your COOP tagLibraries. This example assumes that your share directory with the COOP library is at the root of your web server. --->
<cfimport prefix="coop" tagLib="/share/tags/coop">
<cfimport prefix="icejQuery" tagLib="/share/tags/coop/jquery">

<!--- Set up your coop page. --->
<coop:coop>
<html>
   <head>
       <title>JQGrid Example</title>
        </head>
   <body>
      <!--- Your grid tag will only require an id attribute here. The other settings will be managed via the coProcessor. --->
       <icejQuery:jqGrid id="myJQGrid"/>
   </body>
</html>
</coop:coop>

Next, this is the COProcessor, called coop_jqGridExample.cfc

<cfcomponent>
   <cffunction name="onPageStart">
       <cfscript>
           var _init = structNew();
           /*
           Here we set up the attributes for the grid Object
           The gridObject attribute is an object that contains the griData,
           and either self generates or allows you to set other things required
           by the jQGrid.
           The getDataMethod attribute is the method name that will be called from the browser
           to populate the grid with data.
           *//
           createOJQGrid();
           _init.myJQGrid.jqGridObject = variables.oJQGrid;
           _init.myJQGrid.getDataMethod="getData";
                     return _init;
       </cfscript>
   </cffunction>
     <cffunction name="createOJQGrid" output="false">
       <!--- This function is where we create the jQGrid Object that is passed into the tag. --->
       <cfscript>
        if (NOT structKeyExists(variables,"ojQGrid")) {
           variables.oJqGrid = createObject("component","share.objects.coop.jquery.jqGridData");
           /* The gridObject's init method requires the following arguments:
           GridID - the ID of the grid you are setting up
           classPath - The classPath to the shareDirectory with a "." at the end.
           data - The data with which to populate the jQGrid
           *//
  variables.oJqGrid.init(gridID:"myJQGrid",classPath:"share.",data:getGalleries());
        }
       </cfscript>
   </cffunction>
     <cffunction name="getData" access="remote" output="true">
       <!---
       This is the method that is called to retrieve the data for the JQGrid.
       Note that the access level must be set to remote 
         in order for it to be accessible from the browser
        --->
       <cfset var data =''>
       <cfset createOJQGrid()>
       <!---
        The data is obtained by caling the getData()
         method and passing it the grid ID and other
         arguments that the JQGrid plugin passes with a request
         --->
       <cfset data = variables.oJQGrid.getData(gridID:'myJQGrid',page:arguments.page,sord:arguments.sord,sidx:arguments.sidx,rows:arguments.rows)>
       <cfcontent reset="true"><cfoutput>#data#</cfoutput>
   </cffunction>
     <cffunction name="getGalleries" output="true">
       <cfquery name="photoQuery" datasource="coop">
           SELECT *
           FROM PHOTOS
       </cfquery>
       <cfreturn photoQuery>
   </cffunction>
</cfcomponent>