Win a copy of Functional Reactive Programming this week in the Other Languages forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

Connecting two separate iframes from two different web pages

 
Ruchir Vaishnav
Greenhorn
Posts: 3
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I dont know how can I explain this. But I will try my best by putting entire issue in series of steps below.


Step 1: I have a web page with two <div> tags located besides each other. We will call them the right <div> and the left <div>

Step 2: Left <div> has a drop down list that dynamically generates navigation as shown in the code below.
<form style="margin-left:3%; margin-bottom:1%" action="" method="post">
<SELECT ONCHANGE="if (window.frames && window.frames.iframes) {
window.frames.iframes.location.href =
this.options[this.selectedIndex].value;
}">
<OPTION VALUE="Swimming.html">Swimming
<OPTION VALUE="TaxServices.html">Tax Services
<OPTION VALUE="TravelLeisure.html">Travel & Leisure
<OPTION VALUE="ymca.html">Waste Management
<OPTION VALUE="WaterManagement.html">Water Management
<OPTION VALUE="Welding.html">Welding
</SELECT>
<iframe id="theFrame" name="iframes" src="murrieta.html" align="top" style="margin-top:7%;height:95%; width:100%;"></iframe>
</form>

Step 3: To explain step 2 better, For e.g. if option "Swimming" is selected from the option group on left <div>, it will launch its child links in
in the iframe nam as "iframes"

Step 4: The option "Swimming" has an html file associated with it called "Swimming.html" This file has three links as mentioned below

<ul>
<li><a href="http://www.google.com" id="l14">about us</a></li>
<li><a href="murrietainfo2.html" id="l15">services</a></li>
<li><a href="murrietainfo3.html" id="l16">pricing</a></li>
<li><a href="murrietainfo4.html" id="l17">contacts</a></li>
</ul>

Step 5: To explain step 4 better, if "Swimming" option is selected, it will launch four links in iframe region

Step 6: NOW IT GETS REAL TRICKEY

Step 7: My Requirement is : say if user clicks "about us" link for "Swimming" option in left <div> tag, it should lauch "www.google.com" in
the iframe of right <div>. Say, if use selects "services" link for "Swimming" option in left <div> tag, it should launch "murrietainfo2.html"
in the iframe of right <div>


Step 8: i need to do this for all of options, as all of options in option list has child links that will be dropped in the left div iframe


PLEASE PLEASE HELP

Thanks,
Ruchir
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 65227
95
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
"darshan cpl", please check your private messages for an important administrative matter.
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 65227
95
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
So what's the problem?
 
Ruchir Vaishnav
Greenhorn
Posts: 3
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Bear Bibeault wrote:So what's the problem?


I just dont know how to achieve this? I tried various ways but no luck.
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 65227
95
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
What's the specific stumbling point. You seem to have what needs to be done mapped out pretty well, what's the specific task that you are struggling with?
 
Ruchir Vaishnav
Greenhorn
Posts: 3
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Ruchir Vaishnav wrote:
Bear Bibeault wrote:So what's the problem?


I just dont know how to achieve this? I tried various ways but no luck.


I am stuck after Point 5 is completed I was able to create one iframe and link to options in step 1 to step 4 without any problem.

I just dont know how can I link the target iframe, which is located in right div tag with links located under iframe from left div tag. And though, it looks as one wep page on browser, but each iframe points to a separate .html file in the background.

That means, technically speaking, I need to have "about us" link under "a_iframe" (from left div tag) in "Swimming.html" file to talk to
main.html that will be dropped under right side <div> tag's iframe.

If you would entertain one email from me. I would be happy to graphically explain this to you.

Thank you so much sir for reading this thread with great interest.

--------------------
Step 6: NOW IT GETS REAL TRICKEY

Step 7: My Requirement is : say if user clicks "about us" link for "Swimming" option in left <div> tag, it should lauch "www.google.com" in
the iframe of right <div>. Say, if use selects "services" link for "Swimming" option in left <div> tag, it should launch "murrietainfo2.html"
in the iframe of right <div>
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 65227
95
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Sounds as if your issues is fereenceing things across frames. Please search this ofrum for other topics dealing with frames and iframes and look at the examples of referencing across frames. A key point is using the parent reference and the iframe names.

Ruchir Vaishnav wrote:If you would entertain one email from me. I would be happy to graphically explain this to you.

Please read this with regards to that request.
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic