PDA

View Full Version : Best way to call functions on other pages..any ideas?



tedteeter
10-17-2013, 03:06 AM
Greetings, Oct 16th, 2013

While using Javascript, DOM what would be the best method for calling functions from other pages. In example, a div receives an iframe that retains a file which has a function to be called from another page. I seemed to have issues with understanding the appropriate DOM hierarchy and tree model when attempting to access elements, functions etc...any ideas? My objective is to have a network message recieved in a div trigger the div to assume "Ontop" status in the zIndex stack! What would be the correct DOM path as below suggests! The below appears around the internet yet doesn't work?

document.getElementById('networkmessage').contentWindow.sendtext('a test to see it work');

Appreciatively,
Ted

jscheuer1
10-17-2013, 05:06 AM
Of course there is a same domain policy in all browsers about pages and their iframes. So whatever you do, both pages must be on the same domain and must have the same www. or not www. in their addresses and must have the same http or https protocol as each other for this to work. If testing locally, some browsers require both pages to be in the same folder.

Assuming that's OK, it would work if countentWindow were something accessible or defined as something accessible and the sendtext() function were in it.

If memory serves the contentWindow of an iframe is a valid object in some browsers, but it might not be able to be accessed so directly from the iframe as a page element gotten by its id. And I'm pretty sure it's only in some browsers.

On the other hand, if you access an iframe as a part of the top page's frames collection, then it's functions (the global ones) are immediately accessible from the top page in all browsers. So, let's say the iframe with the the id 'networkmessage' is the first or only iframe on the page. It would be*:


window.frames[0]

If it (the page inside the iframe) had a function on it called sendtext, then one could do:


window.frames[0].sendtext('a test to see it work');

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.



*The second iframe (if there is one) on a page is:


window.frames[1]

The third, is 2, forth is 3, and so on however many there are.

tedteeter
10-17-2013, 10:06 PM
John, Oct 17th 2013

Well the above has cleared up several questions one other quick question? You wrote
<<Assuming that's OK, it would work if countentWindow were something accessible or defined as something accessible and the sendtext() function were in it.>>
"Iframes, frames" are the popular container while I question can "Divs" as well be the referenced as the frames with the index principal? and could the div reference be placed into a variable to create example as window.divvariable[0].sendtext() ? While I struggle with all discussed I have figured out that I need to always utilize top.window functions or include a JS in each page for the desired function. I like your approach which I have been attempting to utilize, however, all I usually end up with "HtmlObject" and the "HtmlCollection" which I assume needs to be iterated through for the references. Anyways, John thanks for all your assistance...I appreciate having a place to turn to...Oh! I wanted to mention that the option to select "Issue Resolved" doesn't appear after the user initially posts a message for discussion...
Appreciatively,
Ted

jscheuer1
10-18-2013, 05:05 AM
Well, it does work. Here's a top page (cal lit top.htm):


<!DOCTYPE html>
<html>
<head>
<title>Top Page in Send to iframe Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript">
function sendtonetworkframe() {
window.frames[0].sendtext(' a test to see it work');
}
</script>
</head>
<body>
<iframe src="network.htm" width="300" height="300" scrolling="auto" frameborder="1"></iframe><br>
<span onclick="sendtonetworkframe();" title="click me" style="cursor: pointer;">Test</span>
</body>
</html>

And here's network.htm:


<!DOCTYPE html>
<html>
<head>
<title>'Network' Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript">
function sendtext(text){
document.body.insertBefore(document.createTextNode(text), document.body.firstChild);
}
</script>
</head>
<body>

</body>
</html>

On the top page, click on Test and you will see the text appear on network.htm in the iframe.

To answer your other question, yes. If you have a reference to all of something on a page, like all of the divs, you have to iterate over it to get each one. But you can instead do what I have done in my example, supply the index if you know which it is and thereby skip the iteration process.

BTW, window.frames is not an HTML collection. It is a collection of the frames on the page, which are not HTML objects, rather references, each of which represents the window object for the page it contains.

About marking a thread resolved -

Go to your first post in the thread, hit:

Edit

Then in the lower right hit:

Go Advanced

Then in the top portion of the advanced editor "Your Message" section find the drop down for:

Prefix

Change it to Resolved.

tedteeter
10-19-2013, 10:28 PM
John, Oct 19th 2013

Well the above has been a tremendous help and worked wonderfully as you've said it would! Additionally the sentence that you provided referencing the div index and such has helped magnificently! I was concerned that I needed to continually iterate through the elements to reference the divs. The "network.htm" you allowed above as well provided another avenue for me as you have discussed the "Create Elements" option which I have never attempted but does look very helpful!...All of the above documentation that you have provided is magnificent and extremely appreciated !! Your efforts in the forum are amazing while appreciated! After all the above help and the assistance in the past a simple thank you seems inadequate but yet is all I can provide you other than it is very much appreciated !!
Appreciatively,
Ted