Coldfusion list to Modal Window Select to Javascript to Coldusion variable.

I think I have accomplished what was once thought impossible or at least improbable. I have passed variables to a Modal window, allowed the user to execute a form there, passed the variable back to the parent page using javascript, updated a form variable in a hidden form and displayed the results using coldfusion. In other words Server -> client and used that javascript variable as a cf variable. Mixing client and server side data.

Q1. check to see if multiple sources are available for a particular order number(shows we have duplicate order numbers from different
systems)
<cfquery name="chksource" datasource="yourDS">
select distinct source from the table
where order_number = #someordernumber#
</cfquery>

if result is greater than 1 source we have duplicates. So we want the user to select which source they want to use.
First we create a form with hidden input field. We then create the list of sources using valuelist().
We then pass the valuelist to the window.showModalDialog function where the user can select the options.
After the source is selected we pass it back to the form.
We can then set a coldfusion variable to the form value using cfset and javascript document.write.

<cfif #chksource.recordcount# gt 1>
<cfform name="srcform">
<cfinput name="sourcesel" type="hidden" />
</cfform>
 
<cfset sources_list=ValueList(chksource.source)>
 
<script language="javascript" type="text/javascript">
var returnValue=window.showModalDialog("order_chksource.cfm?
source=#sources_list#</cfoutput>","new_win","width=400,height=200");
document.srcform.sourcesel.value= returnValue;
</script>
 
<cfset sourcesel = "<script type='text/javascript' language='javascript'>
document.write(document.srcform.sourcesel.value);
</script>">
<cfoutput>#sourcesel#</cfoutput>
</cfif>

here is the modal window order_chksource.cfm page. It contains a form for the selection of source and the javascript to pass back the selected value to the form on the parent page.
<HEAD>
<TITLE>New Window</TITLE>
<script language="JavaScript">
<!--
function sendAndClose(selObj,restore){
//alert('x='+ selObj.value);
if (selObj.selectedIndex != 0 ){
returnValue=selObj.value;
self.close();
}
}
//-->
</script>
 
</HEAD>
<BODY>
Your tin is duplicated in Source systems (<cfoutput>#url.source#</cfoutput>). Select the source you want to view.
<FORM onsubmit="return false;">
<select name="menu1" onChange="sendAndClose(this,0)">
<option>--Select--</option>
<cfloop list="#url.source#" index="src" delimiters=",">
<cfoutput><option value="#src#">#src#</option></cfoutput>
</cfloop>
</select>
</FORM>
</center>
</BODY>
</HTML>

UPDATE:
While I can display the variable as #sourcesel#
I could not use the variable in a cfquery as part of the where clause.
The output prints the

Cup size   
Select size then click on coffee cup.
This entry was posted in Code, Coldfusion, Javascript, SQL. Bookmark the permalink.