Forum Moderators: open
I have some js that builds a list of links and writes the list into a paragraph in a frame. For example:
function buildLinks()
{
...
aLink = '<a href="' + 'C:/x.htm' + '" class="c" target="'+tgt_frame + '" onClick=editPage() >' + title +'</a><br/>\n';
...
}
function editPage()
{
// Here's the question.
}
I can't figure how to refer to the information in the page that clicking on the generated link loads so I can process its contents. I have found lots of web sites that nearly answer my question but none has panned out so far.
I know that editPage() is being called when I click the link because it can bring up an alert box for example. It may be that I need to invoke onload()instead of onClick() but I haven't been able to figure that out either.
I would appreciate any help.
You have initial page/window (w1) and second iframe/window containing a number of generate links (w2). You also have a function editPage defined within w1 I assume.
The link within w2 refers to editPage, but there is no editPage within w2 or is there ?
If you wish to refer to something not in same window you need to qualify it, say w1.editPage() where w1 has been set up prior.
Here is a cleaner example of a link:
aLink = <a href="C:/x.htm" class="c" target="tgt_frame" onClick=editPage()> title </a>;
As I said, I'm new to this so I may not be asking the right questions. Also, I inherited the code, I didn't originate it. Please be tolerant as I climb the learning curve. My goal is to load the selected page and edit its contents, probably before it is displayed.
Thanks again.
Other than we don't understand what you ask, there's nothing wrong with your question. So we shoot in the air our theories, like a hunter whos gun barrel has a 180 degree curve, pointing to his own head.
My theory is that you want some AJAX fancy nancy loading, but with frames? Like, you click link in FRAME1 and the content loads in FRAME2. If that's what you want, you don't need JS?!
Can you show us some pages where you found those almost good answers? Maybe we'd understand too what you mean.
Is it necessary to put the javascript into x.htm? There are going to be thousands of such files and it would be better for me if I could have the code in one place. That's why I had put the onClick clause in the link. If that's just not doable then I'll have to bite the bullet and modify all of the target files.
Thanks again.
<!-- StartingPage.html -->
<html>
<head>
<script type="text/javascript" language="JavaScript">
function editPage() {
alert(window.frames["tgt_frame"].document.getElementById("Div2").innerHTML);
}
</script>
</head>
<body>
<!-- You use javascript buildLinks() to effectively create the following p-->
<p>
<a href="x.html" class="c" target="tgt_frame" onClick="editPage()">Page 1</a><br/>
<a href="x2.html" class="c" target="tgt_frame" onClick="editPage()">Page 2</a><br/>
<a href="x3.html" class="c" target="tgt_frame" onClick="editPage()">Page 3</a><br/>
</p>
<iframe src="" height="150px" name="tgt_frame"></iframe>
</body>
</html>
<!-- x.html -->
<html>
<head></head>
<body>
<div id="Div1">I have text</div>
<div id="Div2">I have different text</div>
</body>
</html>
<script type="text/javascript" language="JavaScript">
var innerDoc = window.frames["tgt_frame"].document;
function editPage() {
alert(innerDoc.getElementById("Div2").innerHTML);
alert(innerDoc.getElementById("Div1").innerHTML);
}
</script>
Putting the js in x.html is the most direct way. The alternative is to code the iframe ( May not work with older browsers )
<iframe ... onload="editPage(this)" >
As editPage is run in context of main page, references to say document.getElementById will refer to main page, to refer to iframe content you need to use window.frames["tgt_frame"].document as jpope points out. So editPage could look like
function editPage( frameEl ) {
var d = window.frames["tgt_frame"].document; // or frameEl.document
alert( d.getElementById(...).innerHTML );
}
This will only work if main page and iframe content come from same domain.