0

I've searched the entire web for a clear answer but haven't found one yet.

I have this site:

www.helixagent.com/todo/

and I want to load that entire site into a portlet in my main index page.

I tried an iFrame approach but it fails to load the site correctly. The styles and javascript files don't get loaded (i think)

Is there a way to make a portal that mimics a new browser page and load the content exactly as it would if it was directly accessed via the url bar?

1
  • 1
    The iframe approach does load the css and js correctly. Can you show the html/js you used? Commented Feb 6, 2010 at 0:34

3 Answers 3

1

It’s possible to perform cross-domain requests using jQuery.

Simply include this file after loading jQuery, and then you can do funky stuff like:

$('html').load('http://helixagent.com/todo/');

Note that this of course won’t load the embedded CSS and JS files. You’ll need to use an iframe for that:

$(function() {
 $('body').append('<iframe src="http://www.helixagent.com/todo/" />');
});

Live example: http://jsbin.com/uruka

Sign up to request clarification or add additional context in comments.

3 Comments

i looked over at the site you provided. I think this is the term I was looking for but really new to this stuff and feel embarrassed to ask for help. But i'm not familiar with the terms so thank you. How would i get something like this set up and running? the site didn't really offer much help to someone who didn't know what they where talking about when implementing the code...
so i did what you said, now i place the sample you gave after the DOM is ready? i can rename the 'html' to maybe '#todo' and plave a <div id='todo'></div> where i want it to load?
The answer to both questions would be ‘yes’.
1

Here's an example using jQuery and iframe:

$(document).ready(function(){
    $('#somediv').html("<iframe src='http://www.helixagent.com/todo/'></iframe>");
});

This should be placed inside the <head> tag of your page and it will load the entire site with all the js and css too into a div.

3 Comments

www.helixagent.com/drag/ this is the site with the portlets. In one of them I would like to load www.helixagent.com/todo/ do I just place the code you provided in the DIV that belongs to the portlet I would like have my page load into?
I have this snippet <li class="widget color-blue" id="widget3"> <div class="widget-head"> <h3>Widget 3 title</h3> </div> <div class="widget-content"> $('#widget-content').html("<iframe src='helixagent.com/todo/'></iframe>"); </div> </li> that is the div layout for one portlet in a column. you same #somediv, what does this link to? I'm sorry to ask but can you explain please. thank you
oh, i tried you example but its not loading anything. I have the site setup like this for the porlets. <html> <head> <title> CSS scripts Javascripts --jquery </head> <div> <div content> <div todo></div> </div> </div> Javascript --jquery UI --portlet.js </body> </html>
0

Have you looked at using Server Side Includes.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.