Take the 2-minute tour ×
Salesforce Stack Exchange is a question and answer site for Salesforce administrators, implementation experts, developers and anybody in-between. It's 100% free, no registration required.

i have a component which uses iframe. in that i have links to pages. when i click on the link it needs to display the vfpage on the righthand side. but, it is loading the page only once per session or i can say it is reloading the page after some time not like as and when i click on the link. Please help me with this

<apex:component controller="XXX">
    <style type="text/css"> 
        #navigation { font-size:0.85em; width:200px; } 
        #framecontent { 
            position: absolute; 
            top: 0; 
            bottom: 0; 
            left: 0; 
            width: 200px; 
            height: 100%; 
            overflow: hidden; 
            color: white;
        } 
        .innertube{ margin: 15px; }
    </style>
    <apex:outputPanel >
        <div id="framecontent">
            <div class="innertube">
                <div id="navigation">
                    <ul class="top-level">
                        <li><a href='/test/xxx?key=xxxx' target="_parent">Testpage</a></li>
    </apex:outputPanel>
                    </ul>
                </div>
            </div>
        </div>
    </apex:outputPanel>
</apex:component>

Behaviour: The component will shown on the left hand side of the browser and when i click on the link, the respected page will be loaded on the right hand side of the browser. and these are site pages and our site login page is incorporated in another webpage. and pages will be accessible by providing key as an authentication mechanism.

share|improve this question
    
Are you attempting to cause a hyperlink within the iframe to navigate the parent page to the link's URL rather than navigating within the iframe itself? –  Mark Pond Jan 3 '13 at 17:01
    
Yes, in component i have iframe in which i have links to navigate to different pages. when i click on the link from the component, it is not reloading the page everytime. –  Haritha Jan 3 '13 at 17:15
1  
Can you please edit your question and elaborate on the behavior that you are trying to achieve and the behavior that you are experiencing as well as the HTML markup? There is not enough information here to determine a proper solution. –  Mark Pond Jan 3 '13 at 18:41
add comment

1 Answer 1

Revised Answer

While the question still does not provide sufficient context, actual markup nor an iframe I believe what you are attempting is to navigate an iframe from a link which is outside of the frame.

Here is a fully functional demonstration of performing this action, hopefully it gets you started with modifying your own markup to do the same if this is indeed what you're after.

<html>
    <body>
        <div>
            <p>Links</p>
            <a href="http://www.salesforce.com" target="theFrame">Salesforce.com</a><br />
            <a href="http://www.dell.com" target="theFrame">Dell.com</a><br />
            <a href="/apex/YourVFPageName" target="theFrame">Same Domain VF Page</a><br />
        </div>
        <div>
            <p>Frame</p>
            <iframe name="theFrame" src="#" width="800" height="400"></iframe>
        </div>
    </body>
</html>

Original Answer

In the page markup displayed within the iframe you need to target the links to use the parent element. This can be done a few ways:

<base target="_parent" /> will target every link in the page to open in the parent frame.

<a href="#" target="_parent">Link</a> will target just this link to open in the parent frame.

Related SE Question: how to force link from iframe to be opened in the parent window

share|improve this answer
    
This is not working either still loading the same page at the time i click on the link –  Haritha Jan 3 '13 at 18:17
    
Here is my component code –  Haritha Jan 3 '13 at 19:04
    
<apex:component controller="XXX"> <style type="text/css"> #navigation {font-size:0.85em; width:200px;} #framecontent{ position: absolute; top: 0; bottom: 0; left: 0; width: 200px; height: 100%; overflow: hidden; color: white; } .innertube{ margin: 15px; } </style> <apex:outputPanel > <div id="framecontent"> <div class="innertube"> <div id="navigation"> <ul class="top-level"> <li><a href='/test/xxx?key=xxxx' target="_parent">Testpage</a></li> </apex:outputPanel> </ul> </div> </div> </div> </apex:outputPanel> </apex:component> –  Haritha Jan 3 '13 at 19:10
    
Were you able to get this working via these suggestions? –  Mark Pond Jan 8 '13 at 0:01
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.