Click to See Complete Forum and Search --> : iframe help


esthera
12-01-2004, 12:29 PM
I have a form that has one select box calling another - so I am using an iframe.

See the following code:
What I need to do now is show the iframe select box when the page loads with a default value but with it still working that if the user changes the first select box - the second will change as well.
in the second file (in the iframe) I just have the second select box and I will have the correct value displayed - I just want to know how to show it when the page loads.

Can someone help me?





<SCRIPT language="JavaScript1.2">
function getIframe()
{
document.OrderForm.dd.value=parent.iframe1.document.form2.elements[0].value;
}
</SCRIPT>
</head>


<form method="post" action="enter.asp" name="OrderForm" class="typo" onsubmit="getIframe()"><input type=hidden name=orderitemid value=88207>

<Select id="scale" name="scale" size="0" onChange= 'document.getElementById("iframe1").src="doubledye.asp?scale=" + this.value'><option value='n'>Please Select a scale</option>
<OPTION value='1'>1 </option><OPTION value='40'>40 </option><OPTION value='200' selected>200</option></Select>
</td>
<td><B>select box 2</B>
</td>
</tr>
<tr bgcolor="#CCCCCC">
<td width="100%" colspan="2">&nbsp;5' select here</td>

</tr>
<tr>
<td colspan="2" width="100%">
<iframe id="iframe1" name='iframe1' FRAMEBORDER=0 SCROLLING='no' WIDTH=300 HEIGHT=55></iframe>

Warren86
12-01-2004, 12:40 PM
I probably don't understand your problem, but the following code changes any number of select lists to the same index.

<HTML>
<Head>
<Script Language=JavaScript>

var nLists = 4;

function setMates(isList){

isIdx = isList.selectedIndex;
for (n=1; n<nLists+1; n++)
{document.getElementById(n).selectedIndex = isIdx}
}

</Script>
</Head>
<Body>
<center>
<br>
<h4>Cascading Select Lists</h4>
<br>
<select id=1 onChange="setMates(this)">
<option selected> Make a selection </option>
<option value='steel'> Steel </option>
<option value='iron'> Iron </option>
<option value='lead'> Lead </option>
</select>
&nbsp;
<select id=2 onChange="setMates(this)">
<option selected> Make a selection </option>
<option value='copper'> Copper </option>
<option value='brass'> Brass </option>
<option value='tin'> Tin </option>
</select>
&nbsp;
<select id=3 onChange="setMates(this)">
<option selected> Make a selection </option>
<option value='platinum'> Platinum </option>
<option value='gold'> Gold </option>
<option value='silver'> Silver </option>
</select>
&nbsp;
<select id=4 onChange="setMates(this)">
<option selected> Make a selection </option>
<option value='earth'> Earth </option>
<option value='fire'> Fire </option>
<option value='water'> Water </option>
</select>
</center>
</Body>
</HTML>

esthera
12-01-2004, 12:48 PM
I need to work with my existing script.
The problem with my script is only that when the page loads the iframe is not showing by default and I want it to show.

I think I need to do soemthing like

function onload()
parent.iframe1.document.form2.elements[0].value=

//set this = to show iframe
}

but i'm not sure what the exact syntax is -- can someone help me?

Warren86
12-01-2004, 12:58 PM
It's selectedIndex.

if you put this in the head of the document that is displayed in your IFrame, it should work.

window.onload=function(){
document.form2.List1.selectedIndex = 2;
}

where, List1 = the "name" of the select list.

esthera
12-01-2004, 01:12 PM
no that didn't do it.
What I need is that from the first page(parent page) it will display the iframe automatically instead of the way it is set now as
function getIframe()
{
document.OrderForm.dd.value=parent.iframe1.document.form2.elements[0].value;
}

Warren86
12-01-2004, 01:17 PM
It seems to me that you are attempting to create an Iframe in an existing text field within a form. I'm at loss to understand why that would be necessary. Are you simply trying to "unhide" a select list based upon the selection of another select list? If that is not what you are attempting to do, then I have nothing further to offer.