Here is a question forwarded to me from Ben Forta. He thought I could take a stab at it so here is my answer.
This is something I kind of touched on before. When you pass a query to a cfgrid, you can include HTML in the query data. This HTML will render in the grid. So consider the following code.I am putting a query result set into a
from a cfc bind statement (which works with no problem). What I want to be able to do is have one grid column with an "ADD" button in it. When the button/cell is clicked it invokes another function that writes some data to a database. Everything I have read only addresses the edit/delete mode of the grid data itself. I want to "click" the item and have it add to another list/container/database.
<cfquery name="entries" datasource="cfartgallery" maxrows="12"> select * from art </cfquery><cfset queryAddColumn(entries, "add", arrayNew(1))>
<cfloop query="entries"> <cfset querySetCell(entries, "add", "<input value='Add' type='button' onclick='javascript:testit(#artid#)'>", currentrow)> </cfloop>
I took a simple query and added a new column, "add". I looped over the query and for each row, added an HTML button that calls a JavaScript function and passes the primary key of the row.
Just to ensure it works, here is the rest of the code:
<script> function testit(x) { alert(x);} </script><cfform name="test"> <cfgrid autowidth="true" name="entries" format="html" query="entries" width="600"> <cfgridcolumn name="artid" display="false">
<cfgridcolumn name="artname" header="Name"> <cfgridcolumn name="price" header="Price"> <cfgridcolumn name="add" header="Add"> </cfgrid> </cfform>
If you run this in your browser, you can click on any button and see the JavaScript called. So that's the difficult part really. If you want to pass this 'add action' to the server, you can use cfajaxproxy. I assume this part is easy, if folks want to see that part of the code, I can work that up as well.