/    Sign up×
Community /Pin to ProfileBookmark

Access data in a iframe using javascript.

I have created a form in a iframe (using Walter Zorn’s wz_tooltip.js) and I want to use javascript to validate the contents before posting. I’m not sure what parameter in the DOM to use to retrieve the data. When not in an iframe I can use (document.testit1.form1.value) and data is returned properly. When I attempt this (document.testit2.form2.value) when the form is in an iframe I receive the error

document.testit2.form2 is undefined
document.write(document.testit2.form2.value);

The link for the sample code is [url]http://www.schuckman.com/misc/testform/testform.html[/url]

Follows is sample code to demonstrate the problem

Any help will be appreciated.

[CODE]<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
<html>
<head>
<title>Test form</title>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″>
<script type=”text/javascript” language=”JavaScript”>
function displayData1() {
document.write(document.testit1.form1.value);
}
function displayData2() {
document.write(document.testit2.form2.value);
}
</script>
</head>
<body>
<script type=”text/javascript” src=”wz_tooltip.js”></script>
<script type=”text/javascript” src=”tip_centerwindow.js”></script>

<p>This part works properly</p>
<form name=”testit1″ onSubmit=”return displayData1()”>
Form Field 1: <input type=”text” name=”form1″ value=”Jumper1″ size=”10″ maxlength=”10″><br>
<input type=”submit” value=”Post Data 1″>
</form>

<p>This part fails with the error “document.testit2.form2 is undefined – document.write(document.testit2.form2.value);” after “Post Data 2” is clicked. </p>
<p><a href=”#null” onclick=”TagToTip(‘marker1’, CENTERWINDOW, true, CENTERALWAYS, true, TITLE, ‘Form Test’)”>Click Here</a> to display form, then click Post Data 2.</p>

<div id=”marker1″>
<form name=”testit2″ onSubmit=”return displayData2()”>
Form Field 2: <input type=”text” name=”form2″ value=”Jumper2″ size=”10″ maxlength=”10″><br>
<input type=”submit” value=”Post Data 2″>
</form>
</div>

</body>
</html>
[/CODE]

to post a comment
JavaScript

4 Comments(s)

Copy linkTweet thisAlerts:
@gil_davisApr 01.2009 — An IFRAME is a window, and it has its own document.
window.top.iframename.document.testit2.form2.value
Copy linkTweet thisAlerts:
@Steve1951authorApr 01.2009 — Gil,

Thanks for your reply. I changed

From:

document.write(document.testit2.form2.value);

To:

document.write(window.top.WzTtIfRm.document.testit2.form2.value);

and still no success. As best as I can tell from the wz_tooltip.js script, the iframe id is "WzTtIfRm". It's pretty obvious I'm a novice working with the DOM, but I'm learning.

Steve
Copy linkTweet thisAlerts:
@gil_davisApr 02.2009 — When you use document.write() after the page has loaded, you erase the current document. That means your script and DOM are all gone.

If your intention was to write something in the IFRAME, then you need to use
window.top.WzTtIfRm.document.write(...)
If your intention was debug, then you should use alert() instead and save yourself a huge headache.

You should reserve document.write() for creating customized html inline. For example:
<i>
</i>Today is &lt;script&gt;document.write(new Date());&lt;/script&gt;
Copy linkTweet thisAlerts:
@Steve1951authorApr 02.2009 — I was just using document.write to debug. I am still getting the same error as before ('window.top.WzTtIfRmdocument' is null or not an object). Looks as if I should learn how to create my own iframe instead of using the existing wz_tooltip.js script to create one.
×

Success!

Help @Steve1951 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...