How to populate a cfselect with Flash Remoting
82 comments Posted by: LauraJust because there are few tricky issues when populating a cfselect with Flash Remoting, I made this simple example. There are two ways, one requires our query to contain the columns “data” and “label”, in which case, when we receive the result, we do the same as the cfgrid example:
mycfselect.dataProvider = results;
In this way, we continue accessing the selected value with mycfselect.selectedItem.data as usual.
With the other way, we can keep the columns of our query, and when we receive the results, we specify the column that will be the label:
mycfselect.labelField = "myColumnName";
Note that ActionScript is case sensitive, so when we access these columns, we need make sure we write correctly.
Now, we can access any other column that was provided in the query by
mycfselect.selectedItem.myColumnName, and unless our query contains a “data” column we will not be get anything if we write mycfselect.selectedItem.data.
The function that handles the request:
responseHandler.onResult = function( results: Object ):Void {
//when results are back, populate the cfselect
contactList.labelField = "name";
contactList.dataProvider = results;
}
And the form:
<cfform name="myform" format="Flash">
<cfselect name="contactList" query="memberList" display="name" value="id"
onchange="alert('ID selected: ' + contactList.selectedItem.id)"></cfselect>
<cfinput type="button" name="getValues" value="Populate drop down" onClick="#getData#" />
</cfform>
Update: If we want to select a particular item when the data is returned, we will have to loop through the items returned looking for the right one. The item to be selected can come from many sources, but to make an easy example, we'll get it from a text field. One recommendation though is not to set it in the ActionScript code if it will dynamically change, but set it in a hidden field instead. So the code for that will be:
//previous code here
//put the controls in scope to avoid calling _root
var contactList = contactList;
var idField = idField;
responseHandler.onResult = function( results: Object ):Void {
//when results are back, populate the cfselect
contactList.labelField = "name";
contactList.dataProvider = results;
//select a specific item
for (var i = 0; i < contactList.dataProvider.length; i++){
if (contactList.getItemAt(i).id == idField){
contactList.selectedIndex = i;
break;
}
}
}
Add some field to get the id to select
<cfinput type="text" label="Id" name="idField" value="5" />
A live example
Download the source
We will also make an example of two or more cfselect related with Remoting.
Category: CFForm | ColdFusion | Flash Remoting |
82 Comments so far
Write yours<cfquery name="qGetCompanies" datasource="lynsav">
SELECT companyName, CompanyID, address, contact
From Companies
</cfquery>
<cfform format="flash" skin="haloSilver">
<cfformgroup type="hbox" width="600">
<cfformgroup type="panel">
<cfselect name="companySelect" query="qGetCompanies" display="companyName" width="200">
</cfselect>
<cfformgroup type="panel" label="Edit Company">
<cfinput type="text" name="companyName" label="Company:" required="yes" validate="noblanks" message="First name is required!" bind="{companySelect.selectedItem.companyName}" />
<cfinput type="text" name="Address" label="Address:" bind="{companySelect.selectedItem.address}" />
</cfformgroup>
</cfformgroup>
</cfformgroup>
No not yet. Temporarily, I decided to use the "select from grid as you type" to find the company in the grid. Then select the company in the grid to populate the form items with the bind="{gridname.selectedItem.fieldname}" attribute.
I'll let you know if I figure something out. I'm sure that it will have something to do with placing code to grab data from the query variable in a <savecontent> tag or possibly thru remoting??
Pete
You can then access any column data by using "selectName.selectedItem.columnName". Hope that helps.
In this example, if I wanted to have the button on the same line as the cfselect how would i accomplish this. I have tried the hbox/vbox approach with no success to date
Also , I have successfully populated a cfselect from a query re flashremoting. Using onChange I can then do another flashremoting call for drill down data. This works fine unless I want to make the selected item the first (or only) one in the list populating the cfselect
What gives here?
Sorry
Point 2 still needs sorting though
If you want to trigger the onchange manually you can use the dispatchEvent.I'm not sure if this is your case.
mydropDown.dispatchEvent({type:'change'})
If you just need to populate a cfselect with a query when your form first loads, simply follow the cfform documentation (http://livedocs.macromedia.com/coldfusion/7/htmldocs/00000331.htm):
<cfselect name="employeeid" query="GetAllEmployees"
display="name" value="emp_id"></cfselect>
just make sure your cfc returns a query when you invoke it with cfinvoke.
<cfinvoke ... returnVariable="GetAllEmployees">
I don't know what you are doing, but I don't think you are setting the cfselect correctly.
Make sure you specify the query name, display and value attributes.
mySelect.labelField = "NameField";
mySelect.dataProvider = results;
and you then submit, mySelect comes across as undefined.
Is there a good way of getting this set properly?
(it works fine if I just go with the data/label version)..
This is the problem:
when we populate the drop down with remoting, all the columns in the query we sent are available to us, just like the id in my example. You would then reference it as "mySelect.selectedItem.id".
However, when the form submits, it looks for a specific column, called "data", as in mySelect.selectedItem.data. Because the query you send does not have that column, it comes as undefined.
The easiest workaround would be to send a query with data (and label if you want to omit mySelect.labelField = "NameField";). That would be my preferred method because of its simplicity.
Another workaround could involve having a hidden field bound to the selectedItem.id property of the cfselect and check for the hidden field instead of the select in your action page. (this may fail of the dropdown selection never changes, for which you will have to initialize the hidden field with the same selected value of the dropdown)
Robert,
As of the current version of CF, there is no onload event for flash forms. You can check this blog for an entry on how to get around it (or wait a little for the CF updater). However, I don't see the need to bring data via remoting when the form loads, as we can easily populate it in the standard way.
Keep up the good work. You guys (& gals) are kicking some serious FR and Rich Form butt.
Thanks for your quick response. I am trying to avoid the error that states: The form data has expired, please refresh (reload?) this page in your browser. This seems to happen when the data in the database changes and it is displayed in the form. I can't set the timeout to a large value because I need my users to see the real-time data. Consequently, my users end up refreshing all the time. This is a big enough annoyance that I may discontinue use of flash forms because of it. So, I figured if I load the form without data first and then bring it in via remoting, the chances of seeing that error will be lessened a great deal. Any ideas on how else to avoid this error message?
<cffunction name="getFlashEmployees" returntype="query" access="remote">
<cfquery name="getEmployee" datasource="#application.config.dsn#">
select fname || ' ' || lname as label,
id as data
from ams_employees
where status != 'term'
and status != 'inactive'
</cfquery>
<cfreturn getEmployee>
</cffunction>
The error appears when the timeout has expired, not when the data changes as it does not check for any changes in the database. Unless they are using a back button or something similar so that the browser does not attempt to get the page, you should not see the error, disregarding the timeout (that is true for most browsers except Opera).
Regarding your second question, are you able to call that cfc normally (by cfinvoke or createObject) and dump the query?
Thanks for all your help. I decided to go with your workaround binding the value of the selected item to a hidden field and have things working the way I want.
Thanks
Robert
Any thoughts on this would be of great help.
Not sure what the problem is. There must be something wrong with your sever set up. I looked at the data returned to load the form, and it comes up empty, and hence your dropdown is empty. Remoting is obviously working because it responds to the call, but for some reason the data returned is not populated with the data. Does the same happens if you have other fields prepopulated?
desidiosus,
that is a good point. I added an update to the post with the code.
_global is always available from everywhere that's why it's "global".
I think that you problem is that the whole cfsavecontent never gets executed. Try to make an alert on that cfsavecontent to see if you reach that code.
Flash is not multi-tasking, so If you get it working once it should always work, unless that you are waiting for a response from the server. I'm glad that you found a work around ;)
<cffunction name="getRequestfromEmpId" access="remote" returntype="query">
<cfargument name="id" required="yes" type="numeric">
<!--- <cfset getRequest2 = Querynew("label,data")> --->
<cfquery name="getRequest" datasource="#application.config.dsn#">
select id, name from ams_systems
where id in (select system_id from ams_access where emp_id = #arguments.id# and status ='Approved')
and status != 0
</cfquery>
<cfquery name="getRequest2" dbtype="query">
select id as data, name as label from getRequest
</cfquery>
<cfreturn getRequest2>
</cffunction>
It is good to know that oracle will return the columns as uppercase.
If you want to stay with the label and data to make it instantly work, then you can do as you showed.
However, if you want to use ID and NAME, the raw data as returned from your query, just use the right case in ActionScript:
contactList.labelField = "NAME";
and then to get the id:
contactList.selectedItem.ID
(that will not work if you are going to submit the form normally, as it looks for contactList.selectedItem.data)
Through trial and error, I have found that things work better for me if I make every effort to submit the form normally. Also, if a user ends up reloading their page form submit (or if you do for testing), then the actionscript bound variable that you submit will lose its value.
Robert
I hate to rehash this again, but I've just installed the update on my development server. I haven't changed my code at all, so I know it's the update's fault. Even though everything loads right when it is remoted in, when I submit the form, all the data in the fields comes in as undefined again. Is flash now looking for different field names, or something formatted differently (maybe it wants all uppercase now)?
Thanks,
Robert
theSelect.removeAll();
for (var i = 0; i < results.getLength(); i++){
theSelect.addItem(results.getItemAt(i).labelFieldData, results.getItemAt(i).valueFieldData);
}
Enjoy and good luck!
Any ideas how I can create a pair of dynamic dropdown lists using CFSELECT?
So Imagine had a the first drop down as vehicle manufacturer and the second as the model. The second should be built after the first hs been selected. We have seen this many time in Javascript but can I do it in flashforms?
Steve
Yes, quite easily. I recommend using remoting to bind the data to your second box. Use my code above to clear the second select box and rebind your recordset after remoting on subsequent searches from your primary select. There are plenty of remoting examples listed on this site to get you up in running there.
I think I've done what you are requesting using two tables to link states with countries. (Mucho thanks to Laura's great blog above)
cvCountry is a table with cvcountryID, cvcountryName
cvState is a table with cvstateID, cvstateAB (abbreviation) and cvcountryID
What I needed was when the user chose a new country the CFSELECT for state would populate the proper states/provinces for that country.
Here is the code I used (and surprise, it worked):
<CFFORM format="flash" width="380" action="TestCode.cfm" name="InvestorConfirm">
<CFFORMITEM type="script">
function doStates() {
var connection:mx.remoting.Connection = mx.remoting.NetServices.createGatewayConnection("http://dev.cleantech.com/flashservices/gateway/");
var myService:mx.remoting.NetServiceProxy;
var cvcountryID = cvcountryID;
var cvstateID = cvstateID;
var responseHandler = {};
responseHandler.onResult = function( results: Object ):Void {
var myresultLength = results.getLength();
cvstateID.removeAll();
for (var x=0; x<myresultLength; x++) {
cvstateID.addItem(results.items[x].cvstateAB, results.items[x].cvstateID);
}
}
responseHandler.onStatus = function( stat: Object ):Void {
alert("Error while calling cfc:" + stat.description);
}
myService = connection.getService("CleantechCFC.GetStates", responseHandler);
myService.getCompany(cvcountryID.selectedItem.data);
}
</CFFORMITEM>
<CFSELECT name="cvcountryID" label="Country" onchange="doStates()" width="200" required="yes" message="You did not select a Country">
<CFOUTPUT query="getCnt">
<OPTION value="#getCnt.cvcountryID#"<CFIF getCnt.cvcountryID EQ 1> SELECTED</CFIF>>#getCnt.cvcountryName#</OPTION>
</CFOUTPUT>
</CFSELECT>
<CFSELECT name="cvstateID" label="State/Province" required="yes" width="200" message="You did not select your State/Province">
<OPTION value="">N/A</OPTION>
</CFSELECT>
</CFFORM>
Here is the simple CFC:
<CFCOMPONENT displayname="getInfo">
<CFFUNCTION name="getCompany" access="remote" returntype="query">
<CFARGUMENT name="mycvcountryID" required="false" type="numeric" default="0">
<CFQUERY datasource="DSN" name="getST">
SELECT cvstateID, cvstateAB FROM cvState WHERE cvcountryID = #mycvcountryID# ORDER BY cvstateAB
</CFQUERY>
<CFRETURN getST>
</CFFUNCTION>
</CFCOMPONENT>
Hope this helps. I was lost until I found this great blog and tweaked it a bit for my needs.
I have a cfgrid. When an item in the grid is selected. I bind fields to this selecteditem.
Two of the fields are cfselect fields. The cfselect are simple query lists. I populate these fields via a cfsavecontent:
<cfsavecontent variable="autofillvenfield">
vensite.text = data.dataProvider[data.selectedIndex]['vsite'];
vendiv.text = data.dataProvider[data.selectedIndex]['vdivision'];
</cfsavecontent>
Now I want to let the user change these fields (to correct/update data), but when the selection is made nothing goes into the field, when the selection is made a second time the item selected is entered into the field. Is there a way to stop the need to select twice?
Everything works great except the cfselect.
I have the cfselect populating from a query almost the same as the real estate states cfselect box:
<cfscript>
getsalutations = request.salutationGateway.getAll();
</cfscript>
The information loads into the select box fine.
But I am using the onload function to set up remoting and the default responseHandler.onResult populates the other form fields (from a different table) and should also choose the selected value from the cfselect.
For some reason, this doesn't work all the time. Sometimes the value is selected, sometimes it isn't.
I put an alert that tells me the length of the cfselect (salutation_id.length) into the onload where it loads the data and (supposedly) selects the correct value and it sometimes comes up as 0 when it should be 6.
Since this doesn't happen all the time, I am not sure what could be the cause. It almost seems like sometimes the cfselect is populated after the other fields are populated (that would explain the length = 0), but why would this not happen everytime?
I have also tried hardcoding the <option> into the selectbox instead of loading from a query and I get the same problem.
Any ideas would be greatly appreciated.
I think what you see is what is described in this post:
http://www.asfusion.com/blog/entry/knowing-when-the-cfform-data-arrives
If someone could please help, I would greatly appreciate it. I managed to use the cfselect population example to do what I need it to do. My problem is that the bindings that were all previously working fine are no longer working.
They are all being referenced in this format:bind="{grid.selectedItem.publication}". Is there a known reason why using the flash remoting renders this syntax inoperable? I also tried using the following:
bind="{grid.dataProvider[grid.selectedIndex]['publication']}">
and
bind="{(grid.selectedItem.publication ==undefined)?'':grid.selectedItem.publication}"
- All to no avail! Again, these were all working fine until I used this cfremoting example, which I also desparately need. Has anyone found a resolve to this issue, or know why it is occurring?
Thanks!
<cfinput type="text" name="EmpID" label="EmpID" size="10" disabled="true" bind="{data.dataProvider[grid.selectedIndex]['EmployeeID']}"/>
Just wondering if I can do a <cfoutput> #grid.selectedItem.column# </cfoutput>
What I really need is to put the "selected item" into another table via mysql query.
Something like:
<CFQUERY NAME="myupdate" DATASOURCE="mydsname">
UPDATE mytbl
SET
Rep_Found = '#form.grid.selectedItem.found#'
</CFQUERY>
Can this be done? Is there a syntax that is required or a loop?
Any help would be greatly appreciated. Thanks!
If you are submitting the form, check the syntax in the docs:
http://livedocs.macromedia.com/coldfusion/7/htmldocs/00000266.htm
in the section: Simple selection data (SelectMode = Single, Column, or Row)
I am not completely sure whether that would work if you received that data with remoting though.
i have a question.
i am populating a mulit select box with a query at load. when the user selects mulitple items, i need some AS to pick out the items selected and put into a remoting call to my CFC. Does anyone know how to accomplish this?
i know i will have to loop over the select box, but i am not sure of the syntax involved to pick out the items that were selected.
thanks
tim
when a mulitple type cfselect has mulitple items seleted the cfselect.selectedItems array is populated with the seletedItems
loop over the length of the list
data = cfselect.selectedItems[i].data
When you are remoting, in your result handler do the following (notice I am using addItem, and first load the dummy value data=0 label="Select...":
responseHandler.getData_Result = function( results: Object ):Void {
//when results are back, populate the multi select
selData.removeAll();
//add 0 and 'Select...' for first entry
selData.addItem({data:0, label:'Select...'});
//loop over results and add to the select box
for (var i = 0; i < results.getLength(); i++){
selData.addItem({data:results.getItemAt(i).fieldIdentifier, label:results.getItemAt(i).fieldDescription});
}
}
ALMOST THERE!!! The label properly populates, but the data values don't. What am I doing wrong???
//when results are back, populate the multi select
ownerList.removeAll();
//add 0 and 'Select...' for first entry
ownerList.addItem({data:0, label:'Select...'});
//loop over results and add to the select box
for (var i = 0; i < results.getLength(); i++){
ownerList.addItem({data:results.getItemAt(i).ownerid, label:results.getItemAt(i).ownername});
}
<cfsilent>
<!--- make an empty query to populate the grid with no records --->
<cfset memberList = queryNew("id,name") />
<cfsavecontent variable="getData">
contactList.removeAll();
contactList.addItem("select","0");
contactList.addItem("test","1");
</cfsavecontent>
</cfsilent>
<cfform name="myform" height="150" width="200" format="Flash" timeout="300">
<cfselect name="contactList" query="memberList" display="name" value="id"
onchange="alert('ID selected: ' + contactList.selectedItem.id)"></cfselect>
<cfformgroup type="horizontal">
<cfinput type="button" name="getValues" value="Populate drop down" onClick="#getData#" /></cfformgroup>
</cfform>
<cfsilent>
<cfset memberList = queryNew("id,name") />
<cfsavecontent variable="getData">
contactList.removeAll();
contactList.addItem({data:0, label:'Select...'});
contactList.addItem({data:0, label:'test'});
</cfsavecontent>
</cfsilent>
<cfform name="myform" height="150" width="200" format="Flash" timeout="300">
<cfselect name="contactList" query="memberList" display="name" value="id"
onchange="alert('ID selected: ' + contactList.selectedItem.data)"></cfselect>
<cfformgroup type="horizontal">
<cfinput type="button" name="getValues" value="Populate drop down" onClick="#getData#" /></cfformgroup>
</cfform>
You are absolutely correct. I went over all my code with a fine tooth comb and found out what was causing the problem. Thank you so much for your help!!! I'm so grateful to have asfusion around to help me further development with this stuff!
Jeremy
The id field is a guid.
Are you using Remoting?
I figured you have probably already fixed it by now, but I thought I would ask anyway.
<cfset objTS = CreateObject('Component','cfc.timesheet') />
<cfset qryEntries = objTS.getEntries() />
<cfform ...>
<cfformitem type="script">
function onEntriesChange()
{
var entries = entries;
alert(entries.dataProvider[entries.selectedIndex]["projectid"]);
for(var i=0; i < projectid.length; i++)
{
var selectedValue=entries.dataProvider[entries.selectedIndex]["projectid"];
projectid.selectedIndex = i;
if(projectid.selectedItem.data == selectedValue){break;}
}
}
</cfformitem>
<cfselect name="projectid"
query="qryProject"
size="1"
width="200"
display="displayname"
value="projectid"
label="Project" />
<cfgrid name="entries" query="qryEntries" height="200" width="300" rowheaders="no" onChange="onEntriesChange()">
<cfgridcolumn name="tsid" display="no" />
<cfgridcolumn name="dateofwork" header="Date" mask="MM/DD/YYYY" width="80" />
<cfgridcolumn name="projectname" header="Project" />
<cfgridcolumn name="projectid" display="no" />
<cfgridcolumn name="hours" header="Hours" width="50" />
<cfgridcolumn name="comment" display="no" />
</cfgrid>
</cfform>
As always, any help is greatly appreciated.
The cfgrid tag works fine for one field the "state" field output with cfselect with the following onchange actionscript:
<cfform format="Flash" skin="haloblue">
<cfgrid name="UsersGrid" format="Flash"
query="qNames" rowheaders="No"
onchange="for (var i:Number = 0; i<state.length; i++) {if (state.getItemAt().data == UsersGrid.selectedItem.state) state.selectedIndex = i}">
What I want to get is two cfselects working:
onchange="for (var i:Number = 0; i<state.length; i++) {if (state.getItemAt().data == UsersGrid.selectedItem.state) state.selectedIndex = i}"
AND
onchange="for (var i:Number = 0; i<meetingtime.length; i++) {if (meetingtime.getItemAt().data == UsersGrid.selectedItem.meetingtime) meetingtime.selectedIndex = i}">
How do I do the above idea in actionscript? Thanks a million
<cfgridcolumn name="FIRSTNAME" header="Contact Name">
<cfgridcolumn name="ENTID" display="FALSE">
<cfgridcolumn name="state" header="Next Step">
</cfgrid>
<cfformgroup type="tabnavigator">
<cfformgroup type="page" label="Details: #dateFormat(now(), 'mmm dd, yyyy')#">
<cfformgroup type="horizontal">
<cfinput type="text" name="FIRSTNAME" label="First Name"
bind="{UsersGrid.dataProvider[UsersGrid.selectedIndex]['FIRSTNAME']}"
onChange="UsersGrid.dataProvider.editField(UsersGrid.selectedIndex, 'FIRSTNAME', FIRSTNAME.text);">
<cfselect name="state" width="200" size="1" label="Next Step" onchange="UsersGrid.dataProvider.editField(UsersGrid.selectedIndex, 'state', state.selectedItem.data);">
<option value="nulo">None</OPTION>
<option value="SEND STUDY">SEND STUDY</OPTION>
<option value="SEND PROPOSAL">SEND PROPOSAL</OPTION>
<option value="CALL AND EMAIL">CALL AND EMAIL</OPTION>
<option value="CALL">CALL</OPTION>
<option value="SEND PRESENTATION">SEND PRESENTATION</OPTION>
<option value="MEETING">MEETING</OPTION>
</cfselect>
<cfinput type="hidden" name="ENTID" label="ENTID"
bind="{UsersGrid.dataProvider[UsersGrid.selectedIndex]['ENTID']}"
onChange="UsersGrid.dataProvider.editField(UsersGrid.selectedIndex, 'ENTID', ENTID.text);">
</cfformgroup>
</cfform>
Sweet code, Jeff! I need to enable/disable a button if the destination select box is populated/empty. I have a function to check the length, but it seems that no matter where I call it in your functions, it won't fire. Shouldn't I include it in the dragComplete functions? Thanks and superb job on the code...
I have the select populating just fine - however when the data comes in, I am binding the data to input text fields and a group of radio buttons. The text binding works fine, but of course the radio buttons are a different issue. To accomodate this, I am using a function, which onChange sets the radio button value by using status.selectedData = myGrid.selectedItem.COLUMN. This works great if I manually select an item from the select list, but when the data initially loads, it does not bind, because it doesn't trigger the onChange event. Since there is no onLoad event I can use when the data is populated, I'm not sure what to do. Is there any way to either:
a) force the first item in the select box to recognize the <option value = "">Select xyz</option> (even though I have it, once flash remoting presents the data, the first column automatically selected is the first result)
b) use another event that I'm not aware of instead of onChange in the select box, so that once the data populates in the cfselect, the radio button can recognize that and be properly bound?
I hope this makes sense - please help! :)
after the responseHandler.onResult = function( results: Object):Void {
selectList.labelField = COLUMNNAME;
selectList.dataProvider = results;
I put
selectList.addItemAt(0, {label:'Select xyz'});
selectList.selectedIndex = 0;
}
In the drop down, Select xyz shows up great, but when I select another item, you can see the top option display as 'Select xyz, undefined, undefined, undefined, undefined' - weird. What parameters is it looking for there? When I select that option, it still just displays 'Select xyz', but upon expanding the list the undefined list is appended to it. Any ideas on how I can get rid of those? I am *this* close!
there is an open source cf_select running.
I am getting some strange behaviour occurring using Flash Remoting to populate a few cfselects. As well as using Flash Remoting to populate the cfselects dynamically, I am also using it to enable/disable the cfselects dynamically based on certain selections made.
The issue occurs after the form has been submitted and the cfselects are repopulated with their submitted selections. If a cfselect has been disabled via Flash Remoting, while it correctly displays the selection made before the submit, as well as disabling the cfselect appropriately, the actual dropdown looks as though it has shrunk to a width of 0 (just the down arrow is displayed), with the text from the dropdown overlapping that. It only does this when the cfselect has been disabled. Could this be a bug? I have set the width in the <cfselect> tags, as well as within the ActionScript, but it still comes up with the problem.
If anyone can shed light on this issue, that would be great!
Cheers,
John
I have a tabbed form with twelve different sections. Certain input on early tabs populates data on subsequent tabs. In one instance, I have a selection made on tab four populate a cfselect on a later tab, and also create records in the cfgrid in that same later tab. Then I use Remoting to refresh the cfgrid that displays the records that were just created. The cfgrid was "bound" to the cfselect by a line of Actionscript in the onChange event of the cfgrid.
After using the AsFusion technique to refresh my cfselect via Remoting, I tried to select one of the records in the cfgrid, and found that the cfselect value never changed. If I refreshed the page, so that the same cfgrid and cfselect were populated using the query attribute of their tags, it worked fine.
I used the "data" and "label" option discussed above, and originally was doing this in my onResult remoting call:
responseHandler.refreshMatrixAudiences_Result = function( results: Object ):Void {
//this is the cfselect
Strategy_Matrix_Audience.dataProvider = results;
}
After much futzing around, I found that I had to change that cfselect refresh to:
responseHandler.refreshMatrixAudiences_Result = function( results: Object ):Void {
//this is the cfselect
Strategy_Matrix_Audience.dataProvider = results.items;
}
After that, it worked perfectly.
I would suggest that if anyone is having any binding problems after trying to refresh a cfselect, they add .items to their results in the Remoting onResult.
<cfselect name="prov" query="provincies" display="naam" value="naam" onChange="prov.selectedIndex">
</cfselect>
thank you
http://www.asfusion.com/blog/entry/multiple-selects-related-flash-cfform
I want to add the capability of making each cfselect point to the same item (if it exists for that day) using actionscript (comparing it to the 1st cfselect). If the item doesn't exist for that day, I want to point to the first item in the list, and change the font color of the textbox to red (or something like that). Since I'm fairly new to actionscript, and can't seem to find any examples, any help would be appreciated. Here is the code for my form:
<cfform action="ReserveMultipleForm.cfm" method="POST" name="DynamicForm" format="Flash" skin="halosilver" width="700" height="#FormHeight#">
<cfformgroup type="horizontal" >
<cfinput type="checkbox" name="SameForAllDays" label="Same Equipment for All Days" checked="no">
</cfformgroup>
<cfformitem type="html"><br /></cfformitem>
<cfset count = 0>
<cfloop index="date" list="#list_o_dates#" delimiters=",">
<cfset count = count + 1>
<cfset queryname = "a#count#">
<cfformgroup type="horizontal">
<cfinput type="text" name="DateDisplay#count#" width="75" value="#DateFormat(date, 'mm/dd/yyyy')#" disabled="true">
<cfinput type="hidden" name="Date#count#" value="#date#">
<cfselect name="f_ReserveItemID#count#"
query="#queryname#" value="ReserveItemID"
display="Equipment"
width="400" />
</cfformgroup>
</cfloop>
</cfform>
I want to add the capability of making each cfselect point to the same item (if it exists for that day) using actionscript (comparing it to the 1st cfselect). If the item doesn't exist for that day, I want to point to the first item in the list, and change the font color of the textbox to red (or something like that). Since I'm fairly new to actionscript, and can't seem to find any examples, any help would be appreciated. Here is the code for my form:
<cfform action="ReserveMultipleForm.cfm" method="POST" name="DynamicForm" format="Flash" skin="halosilver" width="700" height="#FormHeight#">
<cfformgroup type="horizontal" >
<cfinput type="checkbox" name="SameForAllDays" label="Same Equipment for All Days" checked="no">
</cfformgroup>
<cfformitem type="html"><br /></cfformitem>
<cfset count = 0>
<cfloop index="date" list="#list_o_dates#" delimiters=",">
<cfset count = count + 1>
<cfset queryname = "a#count#">
<cfformgroup type="horizontal">
<cfinput type="text" name="DateDisplay#count#" width="75" value="#DateFormat(date, 'mm/dd/yyyy')#" disabled="true">
<cfinput type="hidden" name="Date#count#" value="#date#">
<cfselect name="f_ReserveItemID#count#"
query="#queryname#" value="ReserveItemID"
display="Equipment"
width="400" />
</cfformgroup>
</cfloop>
</cfform>
I am trying to refresh my cfselect via flash remoting. I have done this before with no problems, but for some reason I can't get this instance to work. The data is returning correctly, but the data value isn't binding correctly. The label field should be 'category_name' and the data value should be 'category_id'.
I populated a cfgrid with this returned data and everything is returning from the CFC properly. I have no idea why it is not working for the cfselect. I have double checked names, case, and I have read the above posts.
Additional Info: We just upgraded from MX7 to CF8.
Summary of Code:
var myForm = myForm;
responseHandler.onResult = function(results: Object):Void{
myForm.category.labelField = 'category_name';
myForm.category.dataProvider = results.items;
}
<cfselect name="category" label="Parent Category:" query="myCategories" value="category_id" display="category_name" width="250" required="true" enabled="false">
</cfselect>
Note: This select is initially populated by a Coldfusion component invoke and everything works perfect. But, once the remoting call fires, the data value of 'category_id' will not bind to the corresponding labelField.
Halp!
Laura, do you know why this is? Am I setting the value wrong?
How can I set multiple selections from database via remoting?
I have tried:
responseHandler.hae_Result = function( tulos: Object ):Void {
for (var i = 0; i < _root.citys.length; i++){
for (var x = 0; x < tulos.length; x++){
_root.citys.selectedIndices = tulos.items[x].kiid;
break;
}
}
}
Where citys is my cfselect and tulos is the result from the query from my CFC. Kiid is a field of the database.
I've also tried:
_root.citys.selectedItems[i].data = tulos.items[x].kiid;
and
_root.citys.selectedItems[i].id = tulos.items[x].kiid;
and
_root.citys.selectedIndex = tulos.items[x].kiid;
but nothing happens or I get only one selected result.
Can anyone help me?
I used your real estate form as the basis for a registration form. One of the selections in the form is a dropdown of teachers names. The list I quite long (several hundred names). It can become cumbersome typing the first letter of the last name and then scrolling thru names to get to the teacher name you’re looking for. Is there a way thru actionscript to have an input field where you start typing in the name and it starts filtering out the names in the dropdown? I have a similar filter in place for the grid, but don’t seem to be able to figure it out for the dropdown.
Thanks