javascript redirect from iFrame triggered by URL - javascript

http://sequoiapacificmortgage.com/loan-application/
I have embedded the clients' loan application form (on another website) into an iFrame so the user stays on the site. The loan application (upon submit) redirects to the client's Home Page, but unfortunately, it stays within the frame rather than going to the main Home Page window. I had inquired here about how to remedy this, and was told that the Target attribute target="_top" would do the trick.
The loan application processor people have no way to add the Target attribute to the redirect URL, and they have suggested the following:
"The thank you page after the application and before the redirect URL has a unique URL.
Is it possible to code your iframe to recognize this URL and redirect the full site to your home page rather than depending on the vLender redirect within the iframe?
I am including the unique thank you page URL from Lori's website below, the ref_ID attribute is the unique application ID number assigned to my test application (the application ID's are generated using the first 3 letters of the applicant's first name [LYN for Lynsee] and the first 3 letters of the applicant's last name [TES for Testing] followed by the numeric sequence) but you should be able to remove that and have your custom site's code recognize the .php url which would trigger a redirect within your site's code that would take place before our system enacts its redirect to the home page within the iframe.
(https://www.vlender.com/apps/templates/new_thank_you.php?ref_id=LYNTES998262971)"
Is it even possible to do this? Thanks for your advice!
regards, Ned

EDIT:
You could handle the navigation of the iframe, and see what url it goes to.
use onload to see when the iframe navigated to a new page, and contentWindow.location.href to get the url from the iframe.
something like:
function checkURL() {
if(document.getElementById('iframeID').contentWindow.location.href == "UNIQUE_URL") // if the location of the iframe is the unique url
window.location = "redirect.html"; //redirect this page somewhere else.
});
<iframe id="iframeID" onload="checkURL();" ... //onload fires when a page loads in the iframe
on load: http://w3schools.com/jsref/event_frame_onload.asp
get iframe URL:
Get current URL from IFRAME

Related

How can I run JavaScript after specific loads?

I created a redirect function to redirect page when user submits input to the search box. When user search something, it will redirect to some webpage.
Let's say that redirected url is "http://www.google.com" (In real, I used different URL to redirect, but just picked google.com for example)
and below is what I created.
<script>
function redirect(){
window.location = "http://www.google.com";
return false;
}
</script>
The question is----
How can I be able to run another JavaScript <script>alert("hi")</script> when http://www.google.com webpage is successfully loaded?
I'm very new to JavaScript and HTML code, so any advise would be appreciated!
Unfortunately this is not possible. After redirecting to another page, you are not able to perform any actions on it, because you don't own this page and have no permissions to do so (except you are also the owner of the other page). This is similar to iFrames. You cannot access the foreign page, because then you could manipulate it and change it's content.
In your case the only action you could perform is, to show a dialog right before redirecting to another page.

Refresh (not reload) iFrame

I'm trying to figure out how to refresh the contents of an iFrame on a page. I did quite a bit of Googling and hunting around through old posts, but all of the solutions offered are for reloading an iFrame to the initial src URL, and not the active URL.
For example, I have an iFrame that contains my Freshdesk client portal embedded into my main website. If I click around to a couple of different pages within the iFrame, I then want to be able to intercept a page refresh and simply refresh the iFrame to the active page.
Current Behavior:
Freshdesk Home --> Knowledgebase --> New Ticket --> Refresh --> Back to home
Desired Behavior:
Freshdesk Home --> Knowledgebase --> New Ticket --> Refresh --> Back to new ticket screen (the last page visited in the iFrame before triggering the refresh)
The refresh doesn't have to be triggered by an f5 refresh, I can use an inline button on the page, but it needs to reload the iFrame to the same page that it was last on, not the original src URL. I tried the following code, but it refreshes to the home page of my Freshdesk every time:
document.getElementById('iframeid').src = document.getElementById('iframeid').src
and
document.getElementById('some_frame_id').contentWindow.location.reload();
So, how can I refresh my iFrame without restarting back to the original src URL?
You can use the onbeforeunload event https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onbeforeunload to detect that the page is going to be closed or refreshed.
So you can then compare the active src and the original src of the iframe to know if the user navigated to some page inside the iframe.
Then choose your favourite message passing system to make sure the portal has a way to know that src after it loaded again: url parameter, local storage, cookie, something else...
With the help of Shilly and a bit of brainstorming, I figured out a solution to my problem, and am posting it here for anyone else in my situation. Turns out that Freshdesk (the website inside the iframe) allows you to use custom javascript. Using this functionality, I came up with the following:
1) use parent.postMessage on first page load to send the URL of the currently active page to my main website.
2) use sessionStorage to store the URL of the current Freshdesk page on my website
3) on first page load of my main website, check to see if a sessionStorage value is set, and if so, set the iFrame's src to this value.
It's not quite a true "only on refresh" solution, however it does make the last iFrame page visited persist throughout the remainder of the user's session, which means they won't lose their place if refreshing or navigating away temporarily. Thanks to the use of sessionStorage, this will also reset back when the user closes the page, meaning on their next visit they'll restart at the Freshdesk home page (or whatever other website you're hosting inside the iFrame).

javascript: reestablish parent for iframe

I have the following situation: A static web page, say whatever.html, which contains one iframe, both on the same website. The iframe contains a dynamic page (CGI/Perl), say cgi.pl?param=a; based on user action the content of the iframe will be replace by new pages (same CGI script with different parameters), say cgi.pl?param=b.
If the user opens only the iframe page I am able to redirect to the original parent page (the static HTML page):
if(self==top)
top.location.href = "http://www..../whatever.html";
This works, but I would like that the iframe contained in that page is set to the dynamic page which reestablishes the parent. In my solution the iframe will contain only the default dynamic page (cgi.pl?param=a), but it should show cgi.pl?param=b in the iframe.
I hope I explained clearly.
Thanks for your help!
pi
The answer is straightforward. Use the script above to call the container web page with a parameter (e.g. test.html?abcd) and then use a script calling
window.location.search.substring(1)
to send the parameter to the iframe src.

javascript, redirecting within a canvas

I am quite new to javascript and web programming in general. But basically, I have made a facebook canvas applicaiton and I was wondering how I can redirect to a page and make it stay within the iframe using javascript. For example: Right now i have something like
<script type="text/javascript">
window.parent.location = "http://www.google.com";
</script>
but this redirects to the google page not inside the canvas application... Any ideas?
Thank you!
In facebook the redirect option is disabled.So you cannot redirect to any uri unless it is clicked by user.
The redirect is an automatic and by clicking is manual.
11. The primary purpose of your Canvas or Page Tab app on Facebook must not be to simply redirect users out of the Facebook experience and onto an external site.
2.You must not pre-fill any of the fields associated with the following products, unless the user manually generated the content earlier in the workflow: Stream stories (user_message parameter for Facebook.streamPublish and FB.Connect.streamPublish, and message parameter for stream.publish), Photos (caption), Videos (description), Notes (title and content), Links (comment), and Jabber/XMPP.
https://developers.facebook.com/policy/

Link to a page within Facebook iframe

Im looking for a way to link to a webpage within a facebook iframe page
so
http://www.facebook.com/designmystyle/app_244351832329915
would be something like
http://www.facebook.com/designmystyle/app_244351832329915?http://www.lickmystyle.com/contact/
I have tried the method here http://www.codingforums.com/archive/index.php/t-85547.html using
<script type="text/javascript">
<!--
function loadIframe(){
if (location.search.length > 0){
url = unescape(location.search.substring(1))
window.frames["app_runner4f84331f0576e6f73380702"].location=url
}
}
onload=loadI
frame
//-->
Im unsure if app_runner4f84331f0576e6f73380702 is the name or the id of the iframe but it was the only one I could find that had a width of 810px by 800px
Any ideas on if this could be done would be great
If it's a facebook canvas app then the url for it should be of apps.facebook.com and not www.facebook.com.
Any querystring parameter that will be added to your canvas app url will be then passed by facebook to your app by adding it to the url of your app when loaded inside the canvas iframe, so if you direct the user to:
apps.facebook.com/app-name?param=value
facebook will POST the app canvas iframe to:
www.yourdomain.com/canvas-path?param=value
Then you can get that parameter like any other GET parameter and what you want with it.
One thing though, if that parameter is a url then it should be url encoded, other wise things will go wrong.
What I don't understand is what you're trying to do with the url that you want to pass as a parameter, what is this "app_runner4f84331f0576e6f73380702"?
Edit
Oh, it's a page tab, sorry, I missed that part.
I'v never used it before, but it says in the last section (Integrating with Facebook APIs) of the Page Tab Tutorial:
your app will also receive a string parameter called app_data as part
of signed_request if an app_data parameter was set in the original
query string in the URL your tab is loaded on. For the Shop Now link
above, that could look like this:
"http://www.facebook.com/YourPage?v=app_1234567890&app_data=any_string_here".
You can use that to customize the content you render if you control
the generation of the link.
From what I understand, this is exactly what you need in order to get the data.
How ever, you won't be able to change the url of the iframe the way you posted since you have no access to the parent window (your page is on different domain than of facebook, and the browser will prevent it due to the cross-domain policy).
What you can do how ever is just:
document.location.href = URL;
You are in your own page, doesn't matter that it resides in an iframe.
The thing is that you don't need all of that, just be aware in the server side of the parameter that is passed to you from facebook (from the query string) if such exists, and render the page according to that.
There's no reason to render a page that then redirects the page to another url, when you already know what the user wants, you're just making the user make a redundant round trip to your server for nothing.

Categories

Resources