Filtering CFGrid with CFSelect

Posted At : November 20, 2007 2:17 PM | Posted By : Gary Gilbert
Related Categories: Ajax,Coldfusion

A reader asked me yesterday about filtering a CFGrid using a CFSelect. I am quite happy to say that it is dead easy to do using the new CF8 tags. You can also bind your CFGrid to more than one control you just need to handle it with your cffunction.

Take the following grid for example. The grid is bound to a tree control as well as another control. The tree control sends the directory to the geFiles function to return a list of files.

The extensions control is cfselect that returns a list of file extensions that the results can be filtered with. The default item in the select control is an empty string which will indicate to the CFC not to filter the items.

Then in the CFC need to make sure that you have the required grid arguments as well as the optional arguments.

And there you have it, a CFGrid that is bound to two different controls, a tree control and a cfselect.

Happy Coding...

Comments (11) |

del.icio.us |

Digg It! |

Linking Blogs | 6375 Views

11 Comments to "Filtering CFGrid with CFSelect"- Add Yours

Hi,
can you please post your cfc so I can see your query? I'm trying to filter a query with paging but I'm running into the problem that it only filters by page. I want it to filter all on the first page and go to another page if more data is present for page 2. Does that make since? It filtering by each page...

# Posted By knk | 10/17/08 8:19 PM

The CFC has been posted previously you can see the interesting part here http://www.garyrgilbert.com/blog/index.cfm/2007/7/...

# Posted By Gary | 10/19/08 1:22 AM

does this actually work? is there any documentation on the rules for binding in a cfform when it is flash? we have spent weeks trying to
what seems to be simple like this example and nothing works.

# Posted By mike | 3/9/09 5:54 AM

unfortunately the bind attribute is only available for html based grids. If you want to have your flash based grid auto update you are going to have to do it using actionscript.

The folks over at ASFusion did a great tutorial back in 2005 on how you can populate the cfgrid with flash remoting. Check our the post http://www.asfusion.com/blog/entry/populating-a-cf...

# Posted By Gary | 3/10/09 7:12 PM

I have 5 form input fields and a button. I need to refresh the grid on click of the button only by passing the 5 input field values. But the grid is getting called as soon as i enter one or other input fields.. how can i resolve this?

# Posted By manda | 4/17/09 11:07 PM

You are probably attached to the onchange event in the grid, you dont want to bind the grid at all in this case but call the refresh function on the click of the button

# Posted By Gary Gilbert | 4/17/09 2:01 AM

Hi Gary -

I have a cfgrid that appears within a cfwindow when a user clicks in a textbox via onclick="ColdFusion.Window.show('userWin')". The grid is populated with clients from the database. I am trying to figure out how to bind the hidden id attribute of the client to the textbox. Would I use something like bind="cfgrid.id" to make the client's username appear in the textbox and dismiss the cfwindow?

Thanks in advance.

# Posted By Adam | 7/28/09 4:57 AM

Hi Gary...
Another 'binding variables' question...

How can I use a url variable as a pass parameter in my cfgrid binding statement, in order to use it in my SQL WHERE clause?

For instance...I want to pass #url.myVar# into my cfgrid, as I am going to use it in my WHERE clause in my function. Heres the cfgrid:

(NOTE: the url.myVar is exists on the same page, begore I call cfgrid)

<cfgrid name="10CEItoSS"
format="html"
pagesize="10"
striperows="yes"
bind="cfc:SRTVManager.getCEItoSS({cfgridpage},
{cfgridpagesize},
{cfgridsortcolumn},
{cfgridsortdirection})"> <------DO I NEED TO ADD ANOTHER VAR HERE ??
<cfgridcolumn name="CNum" header="CEI" width="75"/>
<cfgridcolumn name="CSect" header="Section" width="30"/>
<cfgridcolumn name="CPara" header="Para" width="100"/>
<cfgridcolumn name="SSNum" header="Subsys Doc." width="100"/>
<cfgridcolumn name="SSSect" header="Section" width="30"/>
<cfgridcolumn name="SSPara" header="Para" width="100"/>
</cfgrid>

Here's the function in my cfc:
<cffunction name="getCEItoSS" access="remote" returntype="struct" output="false">
   <cfargument name="cfgridpage" type="numeric" required="no">
   <cfargument name="cfgridpagesize" type="numeric" required="no">
   <cfargument name="cfgridsortcolumn" type="string" required="no">
   <cfargument name="cfgridsortdirection" type="string" required="no">
   <cfargument name="p1" type="string" required="yes" default=""> //I don't know if this is correct ???


<cfquery name="get_10cei_subsys" datasource="#this.dsn#" blockfactor="100">
   SELECT DISTINCT SRT_Contract_Rqt.Contract_No As CNum blah, blah...
FROM SRT_Contract_Rqt INNER JOIN blah, blah
   WHERE (((SRT_Contract_Rqt.Contract_No)='10CEI-0001') AND ((SRT_SUBSYSTEM.SS_LLD_No)=#p1#))
   ORDER BY SRT_Contract_Rqt.Para
<cfreturn queryConvertForGrid(get_10cei_subsys,arguments.cfgridpage,arguments.cfgridpagesize)>
</cfquery>
</cffunction>

I want to pass that #p1# into my WHERE clause from the 'bind' statement from the cfgrid....any help would be appreciated!

Been scouring google on this one....nothing.

# Posted By Gary Kane | 2/11/11 5:56 PM

@Gary,

You can bind additional parameters to your bind parameters. You would use the curly braces for example next to cfgridsortdirection as you indicated in your comment. You have to bind to a field that is located in a cfform, eg {myform:fieldname}, which means that the value of your fieldname should be the url variable.

I dont' believe you can bind your grid to a url variable, though you could give it a try e.g. {url:myvar} and if that doesnt work use a hidden form field in your cfform.

# Posted By gary | 2/11/11 11:12 PM

Gary...thanks for the reply. Looks like I fixed the problem using your
suggestions...thx!

I run the code in Firefox with Firebug, and my query result (227 records)
is all 'nulls'. My grid appears (thanks to the previous fix), but with no data,
and firebug shows all nulls being returned for all the records. Any idea
what's going on?? Thanks in advance...

GK

# Posted By Gary Kane | 2/14/11 9:25 PM

OK...I've been playing...

(NOTE: the value of variables.p1 is "10SPC-0188")

Here my cfform, cfgrid with the fix:

<cfform name="myForm">
<input name="getURLVar" type="hidden" value="#variables.p1#" />

<cfgrid name="10CEItoSS"
format="html"
sort="yes"
pagesize="10"
striperows="yes" selectmode="row"
bind="cfc:SRTVManager.getCEItoSS({cfgridpage},
{cfgridpagesize},
{cfgridsortcolumn},
{cfgridsortdirection},
{myForm:getURLVar})">
<cfgridcolumn name="CNum" header="CEI" width="75"/>
<cfgridcolumn name="CSect" header="Section" width="30"/>
<cfgridcolumn name="CPara" header="Para" width="100"/>
<cfgridcolumn name="SSNum" header="Subsys Doc." width="100"/>
<cfgridcolumn name="SSSect" header="Section" width="30"/>
<cfgridcolumn name="SSPara" header="Para" width="100"/>

</cfgrid>
</cfform>

Result: no data returned to grid...firebug shows nulls (query didn't work).

Then, I did this in my bind statement:

bind="cfc:SRTVManager.getCEItoSS({cfgridpage},
{cfgridpagesize},
{cfgridsortcolumn},
{cfgridsortdirection},
'10SPC-0188')">

I passed the literal value, no curly braces...it worked! I get my data :)

So we have a syntax issue, how do I make that pass parameter get resolved
into the query....{myForm:getURLVar} isn't working, not seeing the value.

# Posted By Gary Kane | 2/14/11 11:12 PM

[Add Comment]

Subscribe via RSS
Follow me on Twitter
Or, Receive daily updates via email.

Filtering CFGrid with CFSelect

Subscribe

Tags

Recent Entries

Blogroll

Wish List