I just started using the AJAX features of ColdFusion and I am building a form where when the user selects a radio button in one part it refreshes another part with different radio buttons.
CODE
<cfparam name="get_skus.sku" default="79804">
<cfparam name="sku_suffix" default="s">
<CFQUERY name="get_pricing" datasource="#mydatasource#" username="#myusername#" password="#mypassword#">
Select * from productpricing where sku = <cfqueryparam value="#get_skus.sku#"> order by sortorder
</CFQUERY>
<html>
<head>
<link href="../CustomSettings/stylesheet.css" rel="stylesheet" type="text/css">
</head>
<body>
<!---<cfdump var="#get_pricing#">
<cfdump var="#getvariations#">--->
<cfform>
<cfoutput>
<!---Pricing Area START--->
<table width="100%" border="0" cellpadding="0" bgcolor="##FFFFFF">
<tr>
<td>
<cfif get_pricing.recordcount gt 1>
<table width="100%" cellpadding="0" cellspacing="0">
<cfloop query="get_pricing">
<tr>
<Td height="25" width="15">
<input type="radio" id="sku_suffix" name="sku_suffix" value="#get_pricing.sku_suffix#" <cfif get_Pricing.sortorder EQ 1>checked</cfif>>
</td>
<td class="pricing" style="padding-left:5px; padding-right:5px; ">
$#get_Pricing.price# #get_pricing.description#
</Td>
</tr>
</cfloop>
<Tr>
<td colspan="2" ><hr size="1" noshade></td>
</Tr>
</table>
<cfelse>
<cfinput type="hidden" id="sku_suffix" value="#get_pricing.sku_suffix#" name="sku_suffix">
</cfif>
</td>
</tr>
</table>
<!---Pricing Area END--->
<!---Variations Area START--->
<cfdiv id="variation" bind="url:bind_get_variations.cfm?sku=#get_skus.sku#&sku_suffix={sku_suffix}">
<CFQUERY name="getvariations" datasource="#mydatasource#" username="#myusername#" password="#mypassword#">
Select * from variations where sku = <cfqueryparam value="#get_skus.sku#"> AND sku_suffix = <cfqueryparam value="#sku_suffix#">
</CFQUERY>
<cfset counter2 = 0>
<cfloop query="getvariations">
<CFQUERY name="getgroupvariations" datasource="#mydatasource#" username="#myusername#" password="#mypassword#">
Select * from groupvariations where id = <cfqueryparam value="#getvariations.groupvariationid#">
</CFQUERY>
<cfset counter2 = counter2 + 1>
<cfif getGroupVariations.recordcount gt 0>
<table width="100%" border="0" cellpadding="3" cellspacing="3" bgcolor="##FFFFFF">
<thead>
<tr>
<td bgcolor="##EAEAEA" >
<img src="#systemimages#systemimages/spacer.gif" width="1" height="30" align="absmiddle"><span class="sectiontitles">#getgroupvariations.defaultlabel#</span>
</td>
</tr>
</thead>
<tbody>
<tr>
<td>
<CFLOOP From="1" To="#listLen(getgroupvariations.variationvalues)#" INDEX="Counter">
<input type="radio" name="Variation#Counter2#" value="#listGetAt(getgroupvariations.variationvalues, Counter)#" checked> <span class="productoptions">#listGetAt(getgroupvariations.variationvalues, Counter)#</span> <br>
</cfloop>
</td>
</tr>
</tbody>
</table>
</cfif>
</cfloop>
</cfdiv>
<!---Variations Area END--->
</cfoutput>
</cfform>
</body>
</html>
bind_get_variations.cfm
CODE
<CFQUERY name="getvariations" datasource="#mydatasource#" username="#myusername#" password="#mypassword#">
Select * from variations where sku = <cfqueryparam value="#url.sku#"> AND sku_suffix = <cfqueryparam value="#sku_suffix#">
</CFQUERY>
<cfset counter2 = 0>
<cfloop query="getvariations">
<CFQUERY name="getgroupvariations" datasource="#mydatasource#" username="#myusername#" password="#mypassword#">
Select * from groupvariations where id = <cfqueryparam value="#getvariations.groupvariationid#">
</CFQUERY>
<cfset counter2 = counter2 + 1>
<cfif getGroupVariations.recordcount gt 0>
<cfoutput>
<table width="100%" border="0" cellpadding="3" cellspacing="3" bgcolor="##FFFFFF">
<thead>
<tr>
<td bgcolor="##EAEAEA" >
<img src="#systemimages#systemimages/spacer.gif" width="1" height="30" align="absmiddle"><span class="sectiontitles">#getgroupvariations.defaultlabel#</span>
</td>
</tr>
</thead>
<tbody>
<tr>
<td>
<CFLOOP From="1" To="#listLen(getgroupvariations.variationvalues)#" INDEX="Counter">
<input type="radio" name="Variation#Counter2#" value="#listGetAt(getgroupvariations.variationvalues, Counter)#" checked> <span class="productoptions">#listGetAt(getgroupvariations.variationvalues, Counter)#</span> <br>
</cfloop>
</td>
</tr>
</tbody>
</table>
</cfoutput>
</cfif>
</cfloop>
I know that it is pretty rough looking right now because I am not done with it. But what happens is that when I select a radio button in the first page I have to also click somewhere else on thep age for the bind to kick in.