Jul
29

Populating a cfgrid with Flash Remoting

147 comments Posted by: Laura

As a follow up of my last post, I made an example on how to populate a cfgrid with Flash Remoting.
The basic difference is that now the ColdFusion component returns a query instead of a string. The important part in the ActionScript code is how we set the data to the datagrid. To show the effect, I create a cfgrid and populate it with an empty query, so that when I call the component, I can see the data loaded.

The main change is in the function that handles the response:

responseHandler.onResult = function( results: Object ):Void {
   //when results are back, populate the cfgrid
   contactList.dataProvider = results;
}

Note: If you want the dataProvider to be an array (like it is when you load the grid normally), use: contactList.dataProvider = results.items; This will make it work if you are using our "Filtering as you type" code.

The number of records returned can be found at results.length. You could notify the user that no records were found.

responseHandler.onResult = function( results: Object ):Void {
   //when results are back, populate the cfgrid
   contactList.dataProvider = results;
   if (!results.length){
      alert('No records found');
   }
}

The complete code:

<!--- make an empty query to populate the grid with no records --->
<cfset memberlist="queryNew("id,name,age,gender")">
<cfsavecontent variable="getData">
   //create connection
   var connection:mx.remoting.Connection =
      mx.remoting.NetServices.createGatewayConnection(
         "http://www.example.com/flashservices/gateway/");
   //declare service
   var myService:mx.remoting.NetServiceProxy;

   var responseHandler = {};

   //put the controls in scope to avoid calling _root
   var contactList = contactList;
   
   responseHandler.onResult = function( results: Object ):Void {
      //when results are back, populate the cfgrid
      contactList.dataProvider = results;
   }

   //function that receives any error that may have occurred during the call

   responseHandler.onStatus = function( stat: Object ):Void {
      //if there is any error, show an alert

      alert("Error while calling cfc:" + stat.description);
   }
      
   //get service

   myService = connection.getService("blog.examples.flashRemotingResponder", responseHandler );
   //make call

   myService.getMembers();
</cfsavecontent>
</cfset>

The form only contains a cfgrid and a button that triggers the call.

<cfform name="myform" format="Flash">
   <cfgrid name="contactList" query="memberList">
      <cfgridcolumn name="name" header="Name">
      <cfgridcolumn name="age" header="Age">
      <cfgridcolumn name="gender" header="Gender">
   </cfgridcolumn>
   <cfinput type="button" name="getValues" value="Populate data grid" onclick="#getData#">
</cfinput>
</cfgridcolumn></cfgridcolumn></cfgrid></cfform>

A live example
Download the source

Category: CFForm | ColdFusion | Flash Remoting |

147 Comments so far

Write yours
CarlosM()
1. CarlosM() wrote on August 02, 2005 at 12:23 PM
Could you please help me out?

I as able to populate the grid with my own query but, how do I pass an argument in a “text box” using remoting to the cfc to return a selective query to populate the grid?

Your insight is much appreciated!
Nahuel
Hi,
In this example (http://www.asfusion.com/blog/entry/remoting-for-coldfusion-flash-forms ) we show you how to pass an argument to the cfc.
CarlosM()
3. CarlosM() wrote on August 02, 2005 at 2:40 PM
Sorry, I'm new to AS.
It didn't occur to me that MyService.getDate(mask.text) is the string passed...:0 I had to take little bits.

Thank You
Paul Roe
4. Paul Roe wrote on August 05, 2005 at 9:54 AM
Is there any way to do two seperate calls to flash remoting with one event.

For example I have the following code:

<cfinput type="Button" name="asdf" value="asdf" onclick="#getData#" />

How can I call two functions in my cfc and work with them in action script. Following your example I am able to populate the cf grid with data based on the value of the cfinput but I also want to get back data from another function at the same time to display text that is not in the grid. How would I go about doing this? Also is there anything like onBlur for a <cfinput type="text" /> field?
AndyC
5. AndyC wrote on August 06, 2005 at 12:30 PM
Hi there,
I have copied across your cfgrid example and set up the remoting and service so that the example works fine on my site
So fa so good
However, when I attempt to adapt the cfgrid-remoting code to my requirements I hit the error

Attribute validation error for tag CFGrid.
The value of the attribute Query, which is currently "q_getPlayerList", is invalid.

The function I am calling is named getPlayerList in a cfc named mlbPlayer in directory mlb
and I call it thus

myService = connection.getService("mlc.mlbPlayer", responseHandler );
   
   myService.getPlayerList();

The function with a simplified query looks like this

<cffunction name="getPlayerList" access="remote" returnType="query">
<cfargument name="name" type="string" required="true" default="Rodr">    
<CFQUERY NAME="q_getPlayerList" Datasource="mlbSQL">

SELECT nameFull
FROM MasterPlayers

</CFQUERY>

<cfreturn q_getPlayerList>
</cffunction>

Any suggestions of where I am in error
Cheers
Laura
Andy,
It seems that you don't have a query with that name in that page. You at least have to have an empty (or not empty) query to tell cfgrid what to populate with, even if you later oeverwrite that data with remoting. Check the first line of the code in the post:
<cfset memberList = queryNew("id,name,age,gender") />
Change that to
<cfset q_getPlayerList = queryNew("nameFull")/>

or simply call your own function (the grid will be loaded with data, not empty)
<cfset q_getPlayerList = yourInstatiatedComponent.getPlayerList() />

Hope that helps
AndyC
7. AndyC wrote on August 07, 2005 at 8:15 AM
Laura
Thanks that was a great help

One quirk I am getting
I am using a text input to obtain a list of baseball players
<cfinput type="text" name="player" width = "150" label="Enter Name" onChange="#getPlayerList#"/>

In <cfsavecontent variable="getPlayerList">
I call
myService.getPlayerList(player.text);

where getPlayerList has a query

SELECT TOP 100 PERCENT MasterPlayers.playerID, careerSpan.nameFirst, careerSpan.nameLast, careerSpan.startyear,
careerSpan.endyear, (careerSpan.nameFirst+' '+careerSpan.nameLast) as nameFull
FROM MasterPlayers INNER JOIN
careerSpan ON MasterPlayers.playerID = careerSpan.playerID
WHERE (careerSpan.nameLast LIKE N'#name#%') OR (careerSpan.nameFirst LIKE N'#name#%')
ORDER BY careerSpan.nameLast, careerSpan.nameFirst

The grid I put the results in shows up the correct data ultimately but precedes this with a wider range of similar, but incorrect, names. This is unlike when i call the query in html or pure flash
Check out the rough version at
http://www.majorleaguecharts.com/mlc/mycfgrid-remoting.cfm

Any hep appreciated
AndyC
I would also like to echo Paul's request re accessing two or more functions via a single onClick, onChange etc
I see this was also asked a week or so ago in the CFDJ article entry. Any chance we could have a definitive answer on whether this is possible in any way
Cheers
Steve Walker
Does anyone have an example of a grid value being passed to a CFC and populating another grid (e.g. orders -&gt; order details)?

I would also like to cast my vote for a multi-function example.
AndyC
Steve
It's in a v rough format and I'm hoping for some answers myself but check out
http://www.majorleaguecharts.com/mlc/mycfgrid-remoting.cfm
enter a players last name and the left hand grid populates (oddly)
Click on one of the names and the righthand grid is populated with details
I dont have the code in front of me but just put an onchange=#getnewgrid# into cfgrid and do a duplicate of the cfsavecontent section (geData i believe) for your original grid just changing references as required
Steve Walker
Andy,

Thank you. I will give it a try. I think I was making it too difficult.
Steve Walker
Andy,

I took a look at your example (very nice) and I am not sure that I understand your problem. Based on the widcards in your Like condition it is working as it should (except for two empty records when I type &quot;smi&quot;). I did notice that it takes a few seconds for the grid to finish re-populating when you change names.

What was the syntax you used for passing the playerID to the component to populate the second grid?


Steve
Steve Walker
So I figured out how to pass the variable (myService.ComponentName(grid1.dataProvider[grid1.selectedIndex]['value_column']);), but have a new problem. One of the fields that is returned is a date field, but the mask is not working. With the mask defined I get the text mm/dd/yyyy, with it undefined I get Thu Jan 13 02:00:00 GMT-0500 2005.
Bob L.
14. Bob L. wrote on August 10, 2005 at 2:40 AM
I would like to return the recordcount of my query to a field or cfformitem in my flash form but i can't get it to work. Do you have any ideas ?
Steve Walker
I used:

<cfformitem type="html" width="400"><cfoutput>#QueryName.RecordCount# Item(s) Listed</cfoutput></cfformitem>
Neil Bailey
I think that tying remoting calls into cf flash forms is brilliant - and the grid is the PERFECT example of this.

However, I am having an issue - I dunno if its ME, or a limitaion that I need to work around. I have a grid w/ three columns, ID, Name and Email - the ID coumn is not displayed. When I get the return value back from the CFC, the Name and Email columns are fine, but the ID column doesn't seem to be being populated (I have ANOTHER remoting call where I am passing the ID from the selected item in the grid to another CFC, and I am getting an error returned that says the ID field is not being passed in). The ID field is DEFINITELY available BEFORE the data in the grid is &quot;filtered&quot;, but DEFINITELY not afterwards...

Any ideas would be MUCH appreciated......
Nahuel
Hi Steve,
The problem with the mask is a bug in ColdFusion. They will fix that in the next release, Merrimack.
Nahuel
Neil,
Check your case in the column name, remember that it must be exactly the same as it comes form the database. (do not trust the case in cfdump)
Nahuel
Andy and Paul,
You can do something like this onChange="#saveContent1##saveConten2#"
in that way you'll have two responseHandlers that do different things when the data comes back.
AndyC
Nahuel
Thanks. I have this working well now
I would also like to include a cfchart in the cfform
trying to adapt your remoting work and some of Ray Camden's on his blog - so far unsuccessfully
Is this feasible?
I could send you my work or post the code here - though it's a bit long
Brendan Rehman
21. Brendan Rehman wrote on August 18, 2005 at 11:19 AM
It just not working for me. I dont get any error messages, non of the events fire... CFMX7 on RH Linux ES, Postgres 8 DB.

Please help...

<cfsilent>
   <cfset _listActiveFolders = queryNew("int_application_id,fk_application_id,vchar_vessel_id,vchar_application_status,date_application_date,vchar_dealer_taxpayer_id,vchar_application_type,int_active_folder_number,vchar_record_created_by,dttm_creation_date,fk_vessel_id,fk_dealer_entity_id_number,vchar_dealer_taxpayer_id") />\
   <cfsavecontent variable="GetActiveFolders">
   
      //alert("GETACTIVEFOLDERS1");
      var connection:mx.remoting.Connection =   mx.remoting.NetServices.createGatewayConnection("http://#cgi.HTTP_HOST#/flashservices/gateway/";);
      var myService:mx.remoting.NetServiceProxy;
      var responseHandler = {};
   
      //put the controls in scope to avoid calling _root
      var ActiveFoldersGrid = ActiveFoldersGrid;
   
      responseHandler.onResult = function( results: Object ):Void
      {
         //when results are back, populate the cfgrid
         ActiveFoldersGrid.dataProvider = results;
      }
      
      //function that receives any error that may have occurred during the call
      responseHandler.onStatus = function( stat: Object ):Void
      {
         //if there is any error, show an alert
         alert("Error while calling cfc:" + stat.description);
      }
      
      //get service
      myService = connection.getService("com.pimsapplications", responseHandler );
      //make call
      myService.fncGetActiveApplications ("0","","IN PROGRESS");
      alert("GETACTIVEFOLDERS2 Function Called");
      
   </cfsavecontent>
</cfsilent>
Rick
22. Rick wrote on August 22, 2005 at 11:42 PM
This has really helped me a lot, but now I am having the user edit the data in the grid and I have an update button. How do I pass the grid data to flash remoting so I can update the database?
Laura
Brendan,
Are you putting the variable in your form in a button?
&lt;cfinput type=&quot;button&quot; onclick=&quot;#GetActiveFolders#&quot; ....&gt;
Laura
Bob,
If you want to know how many records were returned, you can get results.length. You can then write that in a text input or similar.
Frank Gerritse
25. Frank Gerritse wrote on September 01, 2005 at 2:23 AM
Hi there,

This example is working great, but can someone tell me why the mask attribute and display attribute in cfgridcolumn doesn't work when I populate a cfgrid with Flashremoting.

<cfgrid name="autoList" query="Auto1" rowheaders="true" width="820" height="350" gridlines="no" colheaderbold="yes" colheaderalign="center" >

<cfgridcolumn name="AutoID" header="AutoID" width="80" display="no" />
<cfgridcolumn name="Kenteken" header="Kenteken" width="80" />
<cfgridcolumn name="Automerk_omschrijving" header="Automerk" />
<cfgridcolumn name="Autotype" header="Autotype" />
<cfgridcolumn name="Brandstof_omschrijving" header="Brandstof" />
<cfgridcolumn name="APKDatum" header="APK" mask="DD-MM-YYYY" />
<cfgridcolumn name="Tankpasnum" header="Tankpas num" />
<cfgridcolumn name="Tankpas" header="Tankpas pin" />
<cfgridcolumn name="naam" header="Werknemer" />
<cfgridcolumn name="Achternaam" header="Achternaam" display="no" />
</cfgrid>
<cfinput type="button" name="getValues" value="Populate data grid" onClick="#getAutos#">
David Brown
26. David Brown wrote on September 01, 2005 at 8:55 PM
First let me say thank you for this web site. I have created several forms that work great thanks to you guys here. All with flash remoting.

Problem: I grid on the flash form with data from a query on the page. I then make changes to the data in the grid and send the grid.dataProvider back to a cfc to update the database(works great). I then click a button to call another cfc for a new query to send to the grid. This works too. I then edit that data and click the button to send the data back to the cfc to update the db. But I get an error: &quot;Unsupported type found in stream&quot;. So it seems that I can have grid load it with data from a query on the page, edit the data in the grid, send the grid to a cfc and update my db. But if you popluate the grid with flash remoting and try to send the data to a cfc you get an error. Any ideas how to fix this?
Laura
Frank,
the grid mask has a bug. I've always had trouble with it. Fortunately, I heard that it has been fixed in the cf updater.

David,
Flash remoting supports sending queries to Flash but not sending RecordSets (the Flash version of a query) to the server, and that it's why you are getting the &quot;Unsupported type....&quot; error.
It seems that when the cfgrid gets populated the regular way, it doesn't set the dataprovider directly but massages the data so that it is not a recordset but an Array, so are able to send that back to CF. You will have to construct the array yourself before sending it to cf.
andy
28. andy wrote on September 02, 2005 at 10:42 AM
Is flash remoting the only way to change cfgid data from text input without reloading / reinitializing the page?
David D Brown
29. David D Brown wrote on September 02, 2005 at 1:31 PM
Thanks for the info. How do I convert the gridname.dataprovider to an array.

I think I would then send the array to the cfc as an type array. Then loop over the array and insert into the db. right?
Laura
David,
I think this will solve the array problem. To have an array just like the one you get when loading data into the grid normally, set the dataprovider like this:
gridname.dataProvider = results.items;

Andy,
I do not really understand your question, what do you mean by changing the grid data from text imput?
AndyC
Laura
Not that I'm the same Andy as you were replying too, but do you have an answer to the query I posed Nahuel on 14th Aug?
Jeff
Hi there,

I'm trying to populate a cfgrid with Flash Remoting
( like http://www.asfusion.com/blog/entry/populating-a-cfgrid-with-flash-remoting )
from a recordset with complex SQL(Oracle), but the grid create only white lines without data. However, trying with access database the same recordset it`s works fine.

How i can to solve this?

Nahuel
Hi Jeff,
Check your column names because Flash is case sensitive. If you don't know what your columns your recordset has, in the result you can use getColumnNames() or columnNames to get the array with their names.
Jeff
I tried and the grid continues showing white lines without data. With mySQL and access
(single sql), it works fine.
Brent
35. Brent wrote on September 27, 2005 at 1:06 PM
How would you populate the grind on load and not on the click of a button
Nahuel
Hi Brent,
We'll make and example of that once Merrimack goes out
Jeff
Nahuel and Laura, I am having a heck of time getting flash-remoting working with cf mx 7. I have just wiped my machine and done a fresh install (stand-alone). Once I completed the install of 7 I am attempting to run your grid with remoting example. I continually get the error stating &quot;Error while calling cfc: Service flashRemotingResponder not found.&quot; Please point me in the right direction. Thanks so much.
Neil Bailey
Jeff,

That error message that you're getting there (believe me, I've gotten it) means that everything on the remoting side is good, its attempting to make the call, and it can't find the CFC you've specified in the location you're telling it to look.

I keep all of my CFCs in a folder named components. So when I call a CFC from a cfform in a remoting call, I call components.someCFCName

Hope this helps. If not, you're in the right place. These guys are......haha fairly intelligent...
Jeff
Neil/asfusion... DOH!!!!! how simple, how stupid of me... Though a bit confusing 8-). Alright for all the newbs. U must set up iis or whatever webserver u are using properly. Steps I used to resolve. (very easy)

1. Create a virtual directory call asfusion under the site (be sure this points to the directory where the example files were unzipped i.e. c:\wwwtest\asfusion.

2. Next go to line 28 which should read &lt;i&gt;myService = connection.getService(&quot;flashRemotingResponder&quot;, responseHandler ); &lt;/i&gt; and change it to &lt;i&gt;myService = connection.getService(&quot;asfusion.flashRemotingResponder&quot;, responseHandler );&lt;/i&gt;
Notice the &quot;asfusion.&quot; added to reference the cfc properly.

3. Lastly run your example.

I know my description is very elementary, but when you're coding with blinders on at time you tend miss the extremely obvious. Thank you all.

John
40. John wrote on October 03, 2005 at 2:26 PM
In the responseHandler.onResult
is there an alternative to
contactList.dataProvider = results;

when I submit the form after flash remoting
cfgird array is always empty.

Here is another thing I tried.
My grid starts out with some data.
Then when they click a button I use flash remoting to repopulate the data.
When I click on the submit button and submit the form and do a cfdump of the form variables
it shows me an array of the changes I made to the cfgrid prior to the flash remoting
but not after.


Thanks

John
Laura
Jeff,
You can also use a normal directory, writing the correct path from the root to the component. Both actual directories or virtual directories work.
Check &quot;A couple of notes on Remoting&quot; at the bottom of this post:
http://www.asfusion.com/blog/entry/remoting-for-coldfusion-flash-forms

John,
I wouldn't recommend mixing the Flash Remoting approach with the normal submit approach. The only solution I can think of right now is to do the following instead of dataProvider = results:

contactList.dataProvider.removeAll();
for (var i = 0; i &lt; results.length; i++){
   contactList.dataProvider.addItem(results.getItemAt(i));
}

It will be a little slow if you have lots of items.
Also, update will work fine, but to make insert work, you will need to write your own button (instead of using insert=&quot;true&quot;) and set onclick=&quot;GridData.insertRow(contactList);&quot;
The same should be true for delete, but I am not sure why delete is not working with GridData.deleteRow(contactList); though.
Critter
if i run the above example from c:\inetpub\wwwroot\projects\pets\

and use projects.pets.assets.com.flashRemotingResponder

as the path.. i get nothing.. or a null (when attempting the date mask example)

if i place flashRemoteResponder.cfc into the root of my webserver &quot;/&quot; and call it via &quot;flashRemotingResponder&quot; then it works fine.. any suggestions? i'm lost.
Laura
Critter,
Do you get an alert &quot;Error while calling cfc:&quot;...
do the folder pets have assets/com folder?
Are you able to browse
/projects/pets/assets/com/flashRemotingResponder.cfc?method=getDate
?
Critter
No error shown.. when i do the get date example from this site.. i just get a &quot;null&quot; that shows in the textfield. i can access the cfc and that method from other coldfusion templates.. it's just like the flash remoting won't hit anything unless it is in the root.
Jeff
Critter,
I'm guessing you're using IIS as your web server. Go to your virt dir or dir in IIS and go to properties. Be sure the Execute Permissions are set to Scripts and Executables. I noticed the root is set to this by default but created virt dirs or added dirs default to scripts only. Hope this fixes it for you. Good luck.
Critter
I have one server running IIS and one running on Apache. I get the same with both. the flash form is obviously finding the cfc, because if i change the directory structure in the .cfm then it will throw an error saying it cannot find the cfc.. otherwise.. with the grid example it does nothing.. with the date mask one... it just outputs &quot;null&quot; :(
Critter
Ok.. well i found what was causing the problem, although, i do not understand why.. and definitely need to look into it further. when running the examples in an application i alreay have.. the flash remoting returns a &quot;null&quot; when i have an Application.cfc in the application. removing the Application.cfc causes the flash remoting to work as expected... *sigh*
Critter
not sure what is happening, but if i have:

<cffunction name="onRequest" returnType="void">
<cfargument name="thePage" type="string" required="true">
<cfinclude template="#arguments.thePage#">
</cffunction>

in my application.cfc flash remoting returns a null.... remove this function.. and it works fine..
Critter
ray posted a &quot;fix&quot; to his blog about the onRequest function in the application.cfc. so i have that sorted.

one question. i have a grid that is populated via a regular query. the onclick of a row uses flash remoting and returns a struct
if i do
var q = results.QUERY;
alert(q.getLength()); // returns 6;
alert(q.getColumnNames()); returns a list of the columns.

but when i attempt to attach the query to a second grid (lstPetFeedings.dataProvider = q;) i get nothing.. and even alert(q.getItemsAt(0).feedId); returns a blank...

is there any way to dump the object that is returned? like a cfdump?

thanks in advance.. Crit
Laura
Critter,
Regarding the problem of the onRequest method:
A Remoting (or web service) call is different than a normal template call. In those cases, you are calling a method on a component directly. It wouldn't make sense to &quot;include&quot; the &quot;page&quot;, in which case it is a component, to make the method call on it. That goes for any other output that you may do in that method, as it will also make it fail.

Although I don't see your complete code, I think this is your second problem: first, to get the first item the syntax is: q.getItemAt(0), not getItemsAt(0). lsPetFeedings grid is probably not in scope when you try to assign its dataProvider. You can put it into scope by adding var lsPetFeedings = lsPetFeedings; before the onResult function declaration.

Hope that helps
Happy Critter
/me kicks myself. repeatedly!!

i did catch the getItemAt issue.. /and/ setting the var lsPetFeedings = lsPetFeedings did sort that issue of nothing happening with the grid.

many thanks!
Chris
52. Chris wrote on October 23, 2005 at 2:50 PM
Hi there,

populating the grid works like a charm, but, I have an issue with fields that I bind to the grid... I load the grid with query data in an onLoad() event. Next, I have a couple of text fields that use the bind attribute to display some values from a selected row.

When I load the page, the input field displays &quot;undefined&quot;, until a row is selected. Apparently
the grid.selectedItem is undefined, until the grid loads and a row is selected. Is there a way around this, without having to set each field manually in an onChange() event of the grid?

Thank you,

Chris

Laura
Chris,
use {(myGrid.selectedItem!=undefined)? mygrid.selectedItem.myColumn : ''}

you can replace '' by a default if you want.
Chris
54. Chris wrote on November 02, 2005 at 3:02 AM
Laura,

that didn't work for me either... still showed &quot;undefined&quot;. Then I used value=&quot;&quot; instead of the bind attribute, and still got &quot;undefined&quot;... then I realized that a value of &quot;&quot; is regarded as, well, undefined. Now I initially set a blank in the IIF construct and it displays properly.

I am using CF 7.01 on Windows (hotfix applied). Can anyone confirm this behaviour of not accepting empty string values?

Thank you,

Chris
Melissa
55. Melissa wrote on November 02, 2005 at 12:04 PM
I am new to using Flash Remoting with CFForms. I am using the real estate example to go by, which I think is awesome. I can call the cfc and populate a grid. The one thing I cannot figure out is how to call a CFC when a row is clicked in the grid. Thanks.
Chris
56. Chris wrote on November 02, 2005 at 12:18 PM
Melissa,

in the <cfgrid> tag, use the onChange-Attribute to specify whatever you want to be executed when a row is clicked. With CF7 you can use functions that you put in <cfitem type="script"> blocks. With CF6 you need to go the <cfsavecontent> way:

CF7:
<cfgrid name="mygrid"... onChange="myFunc()">
<cfformitem type="script">
function myFunc()
{
... do other things here ...
myService.callMethod();
}
</cfformitem>

CF6:

<cfsavecontent variable="callFunc">
... do other things here ...
myService.callMethod()
</cfsavecontent>

<cfgrid name="myGrid" ... onChange="#callFunc#">

Most likely you will have to put the service into _root or _global context to get it working.

If you want to specify separate result handlers for each method call, name them
responseHandler.MethodName_Result

Both the method name and the "_Result" are case sensitive.

HTH,

Chris
Melissa
57. Melissa wrote on November 02, 2005 at 12:21 PM
Thanks Chris. I will give that a try.
Chris
58. Chris wrote on November 02, 2005 at 2:49 PM
Urgent call for help!!

I built my form and am almost done... it's quite complex and uses a lot of AS. (AS and CFML are about 1100 lines of code, not counting the CFC that queries the database).

Now with the final changes (code reorganisation and inline comments) I suddenly hit the 32K barrier and get the error following msg:

&quot;Branch between 40461 and 73233 around line 0 exceeds 32K span. If possible, please refactor this component.&quot;

I tried to include the &lt;cfformitem&gt; tags that contain the AS and I also tried to put all the AS code into .as files and use #include. Still I get the same error.

Is there any way to get around this? I must deliver this app in two days and Google has let me down this time. :-(((

Thank you,

Chris
Nahuel
Hi Cris,
You can try to set all your syles sheet via actionScript. Because Flex generates a lot of code for each style object.
You can take a look at his post ( and its comments), to get the idea.
http://www.asfusion.com/blog/entry/using-global-css-in-your-cfform
Ryan F
60. Ryan F wrote on November 21, 2005 at 11:52 PM
For some reason i'm getting this back from the responsehandler &quot;Error while calling cfc:Service threw an exception during method invocation: null&quot; I have tested my cfc's and they are known to work when invoked via cfm pages. Are there any pitfalls here i should be looking out for?

The environtment is CF 7.01 running multiserver on iis6

Best regards,

Ryan
Javier Julio
Hey everyone,

This examples work beautifully and has helped me a lot but I realize I have a specific problem. I need to update a field in the grid and I use editField but it does not work. For example:
responseHandler.onResult = function( results: Object ):Void {
   mx.managers.CursorManager.removeBusyCursor();
   alert(&quot;&quot;+grdPaperData.selectedIndex+&quot; &quot;+radScore.selectedRadio.data);
   //when results return update cfgrid
   grdPaperData.editField(grdPaperData.selectedIndex,&quot;score&quot;,radScore.selectedRadio.data);
}

I output the 2 values I need to do an editField in an alert to make sure they exist and they do so I know I have the data I want. All I need to do is update the grid once its done with remoting. radScore is a radio button group. You can have a score of 1-5 that I let users pick from and when its changed I want to update that in my cfgrid. I have gotten it to work when there is no remoting involved at all, but once remoting comes into the picture it does not update the grid. :( Any idea why?? What am I doing wrong?? I have tried both dataProvider.editField and without the dataProvider and it does not update. I do not get any errors in the process, the flash form displays without any issues.
Laura
Ryan,
The null error usually happens when there is an error in the cfc code (or templates that it calls). Even if it works when calling from other templates, check that you are passing the right parameters to verify that the behavior is the same.

Javier,
Since your alert shows the correct data, then it is not a scope problem. Just in case verify that you are declaring the grdPaperData variable before the onResult function. The only thing that can make it fail is that it is not finding the column. Make sure you are using the correct case for &quot;score&quot;. Just so that we get all options out of the way, try converting the radio number to a string (radScore.selectedRadio.data.toString()) . You can also use radScore.selectedData instead of radScore.selectedRadio.data.
Thomary
63. Thomary wrote on December 05, 2005 at 10:23 AM
I want to show a date column in my cfgrid.
StartDate and EndDate brought in from the query
show like (Thu Nov 17 00:00:00 GMT - 0500 2005)
The MySQL column is Format = Date.
I want to show this in my grid as 11/17/05.

I've tried to use mask -
&lt;cfgridcolumn name=&quot;StartDate&quot; header=&quot;Start&quot; width=&quot;250&quot; mask=&quot;mm/dd/yy&quot;&gt;
but it shows in my grid is mm/dd/yy on all rows.
Some rows should not have a date at all.

I tried to set the format in the query but the grid still shows as the (Thu Nov... above)
Any help would be greatly appreciated.
Thomary
64. Thomary wrote on December 05, 2005 at 11:48 AM
I'm sorry, setting the format in the query worked. I had the field name twice.

DATE_FORMAT(queryname.fieldname, '%m-%d-%y') as name,

Select firstname, lastname, DATE_FORMAT(queryname.startdate, '%m-%d-%y') AS sdate, employeeid, ...
Michael Borbor
65. Michael Borbor wrote on December 12, 2005 at 2:42 PM
Hi Laura, I just found out about this site It's just outstanding. I applied your example, it worked out, but I got a problem with data bindings, when my page load first I populate the datagrid with a regular query in my CFC, and my bindings work, but after I populate the datagrid with FlashRemoting my bindings stop working why is that? How can I make my bindings work again?

And another question I got a flash form with an accordion component that has five pages, How can I show a determined page using a button?
Chris
Can anyone help me? I'm a bit new to ColdFusion, and I can't seem to get this to work correctly.

Here's my situation...
I'm getting the following error when trying to update the data displayed in my grid:

"Error while calling cfc:The parameter FROMDATE to function getGridData is required but was not passed in."

Here's my code:

<cfsavecontent variable="getGridData">
   //create connection
   var connection:mx.remoting.Connection = mx.remoting.NetServices.createGatewayConnection("http://cppdc/flashservices/gateway/";);
   //declare service
   var myService:mx.remoting.NetServiceProxy;

   var responseHandler = {};

   //put the controls in scope to avoid calling _root
   var pending_results = pending_results;
   var fromdate = fromdate;
   var todate = todate;
   var currcust = currcust;

   responseHandler.onResult = function( results: Object ):Void {
      //when results are back, populate the cfgrid
       pending_results.dataProvider = results;
       if (!results.length){
   alert('No records found');
      }
   }

   //function that receives any error that may have occurred during the call
   responseHandler.onStatus = function( stat: Object ):Void {
    //if there is any error, show an alert
    alert("Error while calling cfc:" + stat.description);
   }

   //get service
   myService = connection.getService("components.getLabData", responseHandler );
   //make call
   myService.getGridData();
</cfsavecontent>

My CFC contains the following:

<cfcomponent name="getLabData" access="public" description="Responds to Flash remoting requests">

   <cffunction name="getGridData" output="false" description="Returns the query for the PENDING RESULTS grid" access="remote" returntype="query">
      <cfargument name="fromdate" required="true"/>
      <cfargument name="todate" required="true"/>
      <cfargument name="currcust" required="true"/>
         <cfquery name="lab_callsp" datasource="#APPLICATION.dataSource#">
         Select a.*, ltrim(rtrim(c.last_name)) + ', ' + ltrim(rtrim(c.first_name)) as phy_name, d.notes
         from mailbox a, customer c, mailbox_features d
         where #session.where_clause# and
         CreateDate between '#fromdate# 00:00' and '#todate# 23:59' and
         <Cfif currcust eq 0><cfelse> a.cust_id = #currcust# and </cfif>
         <!--- <cfif extra_restrict1 eq 1> a.last_name = '#f_lname#' and </cfif>
         <cfif extra_restrict2 eq 1> a.first_name = '#f_fname#' and </cfif>
         <cfif extra_restrict3 eq 1> a.PatientID = '#f_pid#' and </cfif> --->
         a.cust_id = c.cust_id and
         (a.send_notification = 'P' or
         (a.send_notification = 'Y' and
         (select count(msgid) from mailboxmessages b where a.mailbox_id = b.mailbox_id) = 0)) and
         a.mailbox_id *= d.mailbox_id
         order by a.last_name, a.first_name
         </cfquery>
      <cfreturn lab_callsp>
   </cffunction>
</cfcomponent>

And finally, the cfform:

<cfform format="flash" action="components/getLabData.cfc" name="labNav" method="POST" style="horizontalAlign:center; vertical-align:center; border-width:0" skin="halosilver" height="700" onload="formOnLoad()">
   
      <cfformgroup   type="panel"
                  style="font-size:13px; font-weight:bolder; color:##FFF376; headerColors:##2b4b90,##1A46A6"
                  label="-:: LAB RESULTS ::-">
         <cfformgroup   type="tabnavigator"
                     skin="haloBlue"
                     height="650">
                  
            <!--- First page --->
            <cfformgroup   type="page"
                        style="background-color:##FFFFFF;"
                        label="Lab Result Summary">
               <!--- Show an accordion box for the different sets of results, --->
               <!--- and use a dataGrid in each to display the data --->
                  <cfformgroup   type="horizontal"
                              style="color:##000000; font-size:12px; horizontalAlign: center;">
                     <cfinput   type="text"
                              name="forInput"
                              width="120"
                              onchange="#actionFilter#"
                              label="Filter by:">
            <cfselect   name="column"
                              label="in:"
                              onchange="forInput.text=''"
                              width="120"
                              style="font-weight:bold">
               <option value="First_name">First Name</option>
               <option value="Last_name">Last Name</option>
                        <option value="PatientID">Patient ID</option>
                        <option value="phy_name">Customer</option>
                        <option value="PatientPIN">PID</option>
                        <option value="PatientPhone">Phone Number</option>
                        <option value="CreateDate">Date</option>
            </cfselect>
                     <cfinput   name="fromdate"
                              value="#fromdate#"
                              label="From:"
                              type="datefield"
                              width="120"
                              skin="halosilver"
                              style="color:##000000; font-size:11px; headerColors:##C2D3D6,##FFFFFF">
                     <cfinput   name="todate"
                              value="#todate#"
                              label="To:"
                              type="datefield"
                              width="120"
                              skin="halosilver"
                              style="color:##000000; font-size:11px; headerColors:##C2D3D6,##FFFFFF">
                     <cfinput   name="currcust"
                              value="#currcust#"
                              type="text">
                     <cfinput   name="getDataButton"
                              type="button"
                              value="Submit Date Filters"
                              onClick="#getGridData#">
                     
                     <!--- <cfinput   name="#f_name#"
                              type="hidden">
                     <cfinput   name="#l_name#"
                              type="hidden">
                     <cfinput   name="#f_pid#"
                              type="hidden"> --->
                  </cfformgroup>
               <cfformgroup type="vertical">
                  <cfinclude template="lab_results_summary.cfm">
               </cfformgroup>
            </cfformgroup>
            
            <cfformgroup   type="page"
                        style="background-color:##FFFFFF;"
                        label="Lab Entry">
               <cfformgroup   type="horizontal"
                           style="color:##000000; font-size:12px; horizontalAlign: center;">
                  <cfinclude template="lab_entry.cfm">
               </cfformgroup>
            </cfformgroup>
            
            <cfformgroup   type="page"
                        style="background-color:##FFFFFF;"
                        label="Daily Follow-Up">
               <cfformgroup   type="horizontal"
                           style="color:##000000; font-size:12px; horizontalAlign: center;">
                  <cfinclude template="daily_follow_up.cfm">
               </cfformgroup>
            </cfformgroup>
            
            <cfformgroup   type="page"
                        style="background-color:##FFFFFF;"
                        label="Lab Reports">
               <cfformgroup   type="horizontal"
                           style="color:##000000; font-size:12px; horizontalAlign: center;">
                  <cfinclude template="lab_reports.cfm">
               </cfformgroup>
            </cfformgroup>
            <cfformgroup   type="page"
                        style="background-color:##FFFFFF;"
                        label="5th Tab">
               <!--- 5TH TAB'S CONTENT GOES HERE --->
            </cfformgroup>
            <cfformgroup   type="page"
                        style="background-color:##FFFFFF;"
                        label="6th Tab">
               <!--- 6TH TAB'S CONTENT GOES HERE --->
            </cfformgroup>
            <cfformgroup   type="page"
                        style="background-color:##FFFFFF;"
                        label="7th Tab">
               <!--- 7TH TAB'S CONTENT GOES HERE --->
            </cfformgroup>
            <cfformgroup   type="page"
                        style="background-color:##FFFFFF;"
                        label="8th Tab">
               <!--- 8TH TAB'S CONTENT GOES HERE --->
            </cfformgroup>
         </cfformgroup>
      </cfformgroup>
   </cfform>


Does anyone know why the FROMDATE value isn't being passed to the CFC?
Chris
Nevermind... my &quot; myService.getGridData(); &quot; was not returning anything! DUH!
Laura
Michael,
Your bindings should work, but it all depends on how you are using them. Regarding the accordion, use myAccordion.selectedIndex = 1; or whatever number you want to show, starting from 0.
Michael Borbor Sanchez
69. Michael Borbor Sanchez wrote on December 23, 2005 at 12:23 PM
Thank you Laura, I don't know very much about debugging this kind of stuff but definitely something weird happened after I updated my grid, but luckily thanks to yours Real Estate application articles I change my bindings and now everything is perfect. Keep on writing those kind of articles please. I'm sorry to bother you some much but is it possible to embed a select in a grid?
Laura
Micheal,
No, it is not possible to have a dropdown in a grid. You can do it with hacks, but I do not recommend them.
Michael Borbor
71. Michael Borbor wrote on December 24, 2005 at 8:38 AM
Oki doki Laura, thanks for everything.
Ben
I'm trying to delete specific rows in a grid using checkboxes. I have created a function that is called with an onClick() event with a button but I can't seem to get the value of the rows that are checked.

I'm trying to pass the values to a cfc, If I use an onchange() event in the <cfgrid> tag I can delete the row but the grid disappears, my preferred method is to use checkboxes but I'm not sure how to get the values selected.

My grid looks like:
<cfgrid format="flash" name="blastGrid" rowheaders="false" selectmode="edit" height="400">
<cfgridcolumn name="CheckBox" type="boolean" header="Delete" />
   <cfgridcolumn name="Email_Sale_id" display="no" />
   <cfgridcolumn name="email_address" header="Email" select="no" />
   <cfgridcolumn name="email_company" header="Company" select="no" />
   <cfgridcolumn name="email_name" header="Contact" select="no" />
   <cfgridcolumn name="email_unsub_date" type="date" mask="MM/DD/YYYY" header="Subscribe Date" select="no" />

<cfinput type="button" name="removeContact" value="Remove Checked" onclick="showId()"/>
</cfgrid>

And the AS function looks like:
public function showId():Void
{
var searchArgs:Object = {};

searchArgs.id = blastGrid.selectedItem.Email_Sale_id;

<!--- show clock cursor --->
   mx.managers.CursorManager.setBusyCursor();
   
blastService.remove(searchArgs);

}

Any help would be greatly appreciated.

Ben
Laura
Ben,
This should give you an idea of what to do:
http://www.asfusion.com/blog/entry/checkboxes-in-a-cfgrid
Tim
Great work everyone!
i have a responseHandler function that gets fired when the results return from a call to a cfc.
my problem is i want to assign certain values from the results to certain fields in the form.
like so:

mtHandler.onResult = function(results:Object):Void {
var mt_array = results;
PRJ_Name.text = results.getItemAt(0)[&quot;prj_name&quot;];
PRJ_Desc.text = results.getItemAt(0).prj_desc;
}

but no matter what i try, i can seem to get to the actual fields that contain the values i am looking for.

does anyone know the correct syntax for digging into the result object?

everything i have tried i have used in Flash and those work.

thanks
Tim
Tim
75. Tim wrote on February 09, 2006 at 1:26 PM
Update
i wasnt seeing anything because no records were being returned.
here is what i used to debug it:
var mt_array = results;
var objString = &quot;&quot;;
for(var i in mt_array){
objString += i + &quot; = &quot; + mt_array[i] + &quot;\n&quot;;
}
alert(objString);

this will show all the object inside of the result object.
the syntax that worked for me was:
formfield.text = results.getItemAt(0).item

but if you have more than 1 recordset being returned you will have to loop over each row to get the values out.

Regards
Tim
John DeGrood
76. John DeGrood wrote on February 14, 2006 at 2:30 PM
I see there are already tons of comments to this topic; however, I did not see any relating to multiple grids in a form. For example, (In honor of the great Ben Forta) if I have a movie database and I run a query to get all of the movies from the database, I can use the onResult to place everything into my &quot;moviesGrid&quot;, but what I need to do now is have the onChange event identify when a movie is selected in the &quot;movieGrid&quot; and query the database to select all of the actors associated with the selected movie and then populate the &quot;actorsGrid&quot;.
Pegarm
77. Pegarm wrote on February 24, 2006 at 5:26 AM
No matter what I do, I'm receiving an &quot;Event Handler Exception&quot; error when I'm trying to populate a CFGRID using Flash Remoting. Any thoughts as to what would be causing this ever so descriptive error?
GrassHopper
78. GrassHopper wrote on March 16, 2006 at 12:22 PM
Yet another Newbie question...

I have grid with checkboxes and use flash remoting to populate and update the grid based on this exaample.
I can selectively delete rows ( thanx to http://www.asfusion.com/blog/entry/checkboxes-in-a-cfgrid)
I have set selectmode to 'edit' but am at a loss as to how I can identify new and updated rows and update the database using flash remoting.

Ideas/examples anyone?