Question : Update CFDIV when Dropdown is Dynamically Updated

I have a page with a select and three CFDIV's.  The CFDIV's all have a bind statement that updates the CFDIV when a different option is chosen in the HTML SELECT

This works fine.

I am now dynamically removing items from the SELECT using javascript, and selecting another option in the SELECT list, which also works fine.

However, this does NOT trigger the BIND and the CFDIVs do not update.  The CFDIV's are all bound to the SELECT field and invoke a CFC that is using the ID number from the select to do its next step.

How can I force this to update (likely in the javascript block, but I'm not sure how).

I've seen Coldfusion.location (or something similar, my apologies if I have this wrong) but I don't think that's what I'm trying to do here (I could be wrong).  in all cases, I'm calling a CFC, not loading a CFM script inside the DIVs

Thanks
   
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
<!--- This javascript is used to remove an option from the Select ------------------>
<Script language="javascript">
function removeOptions(selectbox)
{
	var i;
	var j;
	for(i=selectbox.options.length-1;i>=0;i--)
		{
			if(selectbox.options[i].selected)
				{
					selectbox.remove(i);
					j = i-1;
					if(j>0)
						{
							selectbox.options[j].selected = true;
							break;
						}
				}
		}
}
</SCRIPT>

<!--- Start of the form --->
<CFFORM id="theform">
	<TABLE>
		<TR>
			<TD valign=top>
				<SELECT id="PID" name="PID" size="7" style="width: 350px;" onchange="document.theframe.location.href='calc.cfm';">
					<CFLOOP Query="q">
						<option value="#q.PID#" <CFIF q.CurrentRow eq 1>selected</CFIF>> #q.P#
					</CFLOOP>
				</SELECT>
			</TD>
			<TD valign=top>
				<!--- This dynamically loads a block of HTML that contain HTML buttons, with JS attached, to update content of the iframe below --->
				<!--- it is essentially loading different buttons that do different things, but all end with the onclick example below, which works fine:
						<button name="x" id="x" onclick="removeOptions(PID);"></button>
				--->
				<CFDIV bind="cfc:C.showbuttons({PID})" id="buttons"></cfdiv>
			</TD>
		</TR>
	</TABLE>
	<TABLE>
		<TR>
			<TD valign=top colspan=3>
				<CFDIV bind="cfc:C.showheading({PID})" id="bottomheading"></cfdiv>
			</TD>
		</TR>
		<TR>
			<TD valign=top><CFDIV style="width: 550px; overflow: auto;" bind="cfc:C.showdetails({PID})" id="bottom"></cfdiv></TD>
			<TD valign=top style="width: 20px;"></TD>
			<TD valign=top><iframe width="550" height="400" scrolling=no src="calc.cfm" name="theframe" id="theframe"></TD>
		</TR>
	</TABLE>
</CFFORM>

Answer : Update CFDIV when Dropdown is Dynamically Updated

Random Solutions  
 
programming4us programming4us