targeting an iframe or ajax loaded content from an external link?

[halabar]

Hello,

I need to load pages from an external vendor within an iframe or via ajax, and have this content area be updated dynamically on user interaction. In addition, I need to have users be able to access specific pages within the framed (or dynamic) content from a link that they would be emailed. (For example, a link to a specific job posting within a career portal).

How do I pass a variable to an iframe (or ajax-loaded content) so the specific page requested is loaded?..

Any best practices on doing this?..

[Veronica]

Put this into the head section of the page that contains the iframe (replacing 'iframeid' with the actual id of your iframe)

<script type="text/javascript">

function loadIframe(){
if (location.search.length > 0){
url = unescape(location.search.substring(1))

window.frames["iframeid"].location=url
}
}

onload=loadIframe
</script>

When you send the link, send it as

<a href="mainpage.htm?iframecontent.htm">great content</a>

mainpage.htm should be the actual url of your page
iframecontent.htm should be the url of your selected iframe page
The page containing the iframe and iframes themselves should be in the same directory.

[halabar]

The page containing the iframe and iframes themselves should be in the same directory.

Thanks! that seems simple enough, but my framed content is external, so..

Will this work when I am pulling content from an external vendor?.. or does that require something else for that type of targeting to work?.. (I need to provide the vendor with the syntax for creating links that will be generated by a number of methods, "email to a friend" etc.).

[Veronica]

Yes, it's basically just reading anything after the question mark as a string. So the link would be

<a href="mainpage.htm?http://www.whatever.com">Iframe page 1</a>

If someone has javascript turned off, they'll go to the main page with a default page loaded, so you may want to create a default page with some links or noscript content in it.

[halabar]

Yes, it's basically just reading anything after the question mark as a string. So the link would be

<a href="mainpage.htm?http://www.whatever.com">Iframe page 1</a>

If someone has javascript turned off, they'll go to the main page with a default page loaded, so you may want to create a default page with some links or noscript content in it.

Cool! Thanks!!!

[halabar]

OK, I've put it in place, and it isn't pulling in the sub-page from the vendor's provided content. my relevant code sofar:

<script type="text/javascript">

function loadIframe(){
if (location.search.length > 0){
url = unescape(location.search.substring(1))

window.frames["portalcontent"].location=url
}
}

onload=loadIframe
</script>

<iframe id="portalcontent" src="http://www.aerospace.apply2jobs.com/" style="overflow:visible; width:100%;border:1px solid #333;height:400px;"></iframe>

and a link with the vendor's setup is looking like this:

<a href="http://mysite.com/careers/career-portal.html?http://theirsite.com/index.cfm?fuseaction=mExternal.showJob&RID=1&CurrentPage=1">Iframe page 1</a>

Is the extra ? in their link causing the problem? If so, is there a way to wrap it so it works, or?...

[Veronica]

In your iframe, you also need to include

name="portalcontent"

as well as id="portalcontent"

[halabar]

That did it! Thanks!

[Veronica]

After playing around with this, there's one more change you should consider.

The way it's written now, someone could create a link going to your site, with any url framed inside it.

So change the script to:

<script type="text/javascript">
function loadIframe(){
if (location.search.length > 0){
url = unescape(location.search.substring(1))
var domain = "http://www.theirsite.com/"

window.frames["test2"].location=domain + url
}
}

onload=loadIframe
</script>

and then the link would be written without their domain, just the part that comes after the slash.

<a href="http://mysite.com/careers/career-portal.html?index.cfm?fuseaction=mExternal.showJob&RID=1&CurrentPage=1">Iframe page 1</a>

Client side scripting isn't the most secure, but this should help

[halabar]

Thanks! We're looking into adding SSL to the page as well.