Link to home
Start Free TrialLog in
Avatar of drgdrg
drgdrg

asked on

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
   
<!--- 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>

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of leakim971
leakim971
Flag of Guadeloupe image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of drgdrg
drgdrg

ASKER

Thank you, but that doesn't work here.

What I'm doing is using JS to change the selected item in a < SELECT > statement when a BUTTON is clicked on screen.

What I want to happen is have the CFDIV's that are bound to that SELECT re-trigger their CFC (contained in the BIND of the CFDIV) when the SELECT is changed.  One of the parameters of the BIND is that SELECT variable.   If I change the select using the mouse or keyboard, the bind works fine.  If, however, I change it using Javascript, the bind isn't "listening" for that.  

So I'm looking for one of these possible solutions:

1 - a way to use the JS block that updates the SELECT to then trigger the BIND to refresh, or

2 - have the BIND "listen" to the change that is triggered not by keyboard or mouse but by JS

Actually, as I write this, I wonder if I can do something like this in the BIND of the CFDIV... add in to the parameters of the BIND:  ........,{button1@click},{button2@click},{button3@click},etc....

Hmmmmm.....

See, you did help!  I will test over the weekend & post a solution for all, if it works :)
OK. I will play with it too.
Avatar of drgdrg

ASKER

I've got to change the logic around a bit, but I tested & including the button click in the bind will do the trick.  Thanks
You're welcome! Thanks for the points! Have a nice week-end!