PDA

View Full Version : targeting a form field in a different frame

jamieob
10-08-2007, 03:10 PM
I have a frameset with two frames one, scriptFrame, containing a page with the javascript on it the other, mainFrame containing a page with a form, form1, on in, with the text field, text1 in it.

I want to target the text field and change the value from the script running in the scriptFrame.

The code i have is:

parent.mainFrame.document.form1.text1.value='x'

But this does not work.

I can target the document ok using:

parent.mainFrame.document.bgColor="violet"

And running a script from the page with the form on it I can target the form using:

document.form1.text1.value='x'

So why doesn't it work when I put the two together? Any help would be much appreciated.
BarrMan
10-08-2007, 04:47 PM
Are you getting object not defined error or what is the problem?
Try executing this function inside your MainFrame and see what happens.
jamieob
10-08-2007, 05:02 PM
I'm getting "is null or is not an object".

When I execute it from mainFrame it works fine.
jamieob
10-08-2007, 05:11 PM
It's ok, fixed it.

When you suggested executing it from mainframe I realised that it was obviously calling the script before the form had actually loaded into the page.

I switched the frames around and it works fine. Thanks for your help.
BarrMan
10-08-2007, 05:14 PM
I've run a test of my own and it works fine.
Try looking at it and see if you get how it works:
MainFrame.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
</head>

<frameset cols="25%,75%">
<frame name="frame1" src="frame1.html"></frame>
<frame src="frame2.html"></frame>
</frameset>

</html>

frame1.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
</head>

<body>
<form id="form1">
<input type="text" name="text1" value="Change it (If you can)" />
</form>
</body>
</html>
frame2.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<title></title>
<script type="text/javascript">
function change(text)
{
parent.frame1.form1.text1.value = "The text is changed to: " + text;
}
</script>
</head>

<body>
<a href="#top" onClick="change('newText'); return false;">Change frame 1</a>
</body>
</html>
BarrMan
10-08-2007, 05:15 PM
Heh. I just saw your reply. Would have saved me some time :p