In my page i have iframe code. When i click particluar link that i frame window enabled.it is a form.when i submit the form i get some hidden field values.how can i access those values in my parent page?.
Since your iframe src= a complete url, and not a relative path (i.e: /app/appsignup.jsp) I am going to assume this Iframe exists at another IP or domain than the original page. If this assumption is correct, then you are not going to be able to modify the Iframe's DOM due to cross site scripting security rules in most browsers.
If the parent site, and child iframe exist on the same top level domain, then you can use document.getElementById("iframe_id")
Edit to answer second question:
You can add an onLoad event to the iframe, and so long as the iframe only has 1 form, and the page only changes when submitted, and this is where you want to be redirected.
Here is an example, but know this will redirect the first time and not work!
What you will want to do is put a function in there, and then in the .js for that function check for the second onLoad...
<iframe name="signUp" id="signup" src="10.80.32.9:8080/app/appsignup.jsp"; width="650" height="500" onLoad="window.location('/index.html');">
You will not be able to access the iframe if it's on a different domain and/or port, as yours seem to be. The Same Origin Policy will prevent that.
There may be a workaround, depending on your use case. Maybe add some more details.
Related
Can anybody help me on this, when I embed a google drive video using an iframe it has two play button, how to remove one of this? This happens only in Chrome and Safari so please test it on those browsers.
<iframe src="https://drive.google.com/file/d/1mNaIx2U3m7zL9FW-wksaI1m_rL5Oh47v/preview" width="400" height="300" allowfullscreen="true"></iframe>
As you can see on the iframe that you have to click the play button twice.
Also I cannot use html5 player since most of the videos are large.
here is my fiddle https://jsfiddle.net/1tav74q8/
TL;DR; it's impossible to directly modify the content inside the iframe that comes from different origin that you don't own.
If your iframe and the host have the same origin (domain), interaction between them is easy, simply access the document object to get the element. Example using jQuery:
To hide a button on host element from iframe, use: window.parent.jQuery('button').hide().
To hide a button on iframe element from host, use: jQuery('iframe')[0].contentWindow.jQuery('button').hide()
HOWEVER, if the host and the iframe doesn't have same origin, interaction between each of them are strictly limited. you cannot instruct certain operation directly from the host to the iframe's javascript window or document, and vice versa. And from that, it's safe to say that accessing directly the iframe's DOM element from the host is definitely impossible.
Explanation about Cross-origin script API accessSection from MDN.
JavaScript APIs such as iframe.contentWindow, window.parent, window.open and window.opener allow documents to directly reference each other. When the two documents do not have the same origin, these references provide very limited access to Window and Location objects, as described in the next two sections.
To communicate further between documents from different origins, use window.postMessage.
You can use the window.postMessage function and "message" event listener, to send and receive a message between host and iframe (and vice versa). In your case you would need to sent a message from host to instruct the iframe to hide a button. Then on the receiver end (iframe), get the desired button then hide it. But this technique only works if you own those two origin, you need to declare the "message" event on the iframe end, and since your iframe source is drive.google.com which I assume you are not the owner, then it's definitely impossible.
More explanation: https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage
As far as i am aware of you can not edit iframe content which does not originate on your own server. But i am not sure..
Check this post for a sample
Courseweb
Stackoverflow
Also interesting from this link:
stackoverflow
Get the unique video identifier (0B6VvIWR7judDX25yUGxVNERWUj)
Put into this html:
Hey guys i have a little problem.
I have a page something like this:
<div id="the_box"><iframe src="somesite"></iframe></div>
I have the div on my page but inside the iframe theres a form from another site where i would like to know when the user clicked a button inside that frame, is there a easy way to register that a user clicked?
This is not possible due to browser security restrictions. Events are not allowed to propagate over iframe elements whose src attribute is an external domain.
No this cannot be done . Maximum you can know is when the user clicks anywhere on the iFrame. Not on any elements inside the IFrame , as that violates the browser rules and Internet protocols .
For example:
I have a main page with an iframe in it and my iframe contains a button. When I press the button inside the iframe some scripts are executed, and the design of iframe is changed. Texts appears and other stuff.
How do I detect when iframe scripts are run? (Or the button was pressed?)
The iframe is from a different domain.
If the contents of the iframe come from a different domain than the outside page, then you can't - the browser deliberately stops you from being able to tell much about what is going on inside the iframe. What you can do though is grab the URL the frame is pointing to if it changes.
If it's running in the same domain, you can just access the elements inside the iframe pretty much the same way as you would normally via the document property of the iframe
If the main page and the iframe are on the same domain, you can make the javascript in the iframe call a function or access the elements of the parent frame.
So at the end of the script in the iframe you can do
parent.script_is_finished();
If you have control over the script in the iframe, you could use window.postMessage to communicate with your main page, even if they are in different domains.
Support for this is limited to FF3+, IE8+, Chrome, Safari(5?), Opera10+
Here's a demo on html5demos.
As an update to the fact that the iframe is from a different domain:
Short answer: No. You can't detect clicks within an iframe from another domain.
Longer but still short answer: The reason you can't is the same reason you can change the contents of the iframe -- it'd be a security risk unless the iframe is on the same domain. You simply can't track user activity within an iframe sourced from a different domain.
Sorry, but I hope that helped!
Is it possible to tell if the source of an iFrame has redirected the client to another page? And if so, tell what page the client got redirected to?
onload event
like
<iframe src="http://www.mydomain/" onLoad="alert('fire');"></iframe>
The alert will pop-up whenever the location within the iframe has changed.
check it out here also
Here is a question explaining how to get current location of an iframe
The src attribute won't change if the iframe navigates to a new page, but the location of the iframe's contentWindow will.
If you start the iframe in a page on your own domain you can use the iframes onload event to read iframe.contentWindow.location.href.
Use a try-block, and if it fails because of a cross domain call, you can return that the iframe is now in some remote site.
If it returns a value you can return the url on your site the iframe has navigated to.
Allright, so I've been fiddeling with this script for a while now and I think I've reached a conclusion which I think is worth sharing. Cross-domain is pretty strict, and as far as I know there is no way of telling what url the xmlhttprequest object got passed on to. I did however notice a solution on another site where they suggest using a hidden iFrame (I'm referring to the link in #ayush's answer).
Can the iframe access its parent if I changed its src to "about:blank" after loading it in the parent page?
Note: the iframe is in another domain not the same as the parent page.
No. If you change the src attribute of the frame to about:blank the content of that frame will be replaced with the blank document, and any javascript running inside the iframe will terminate.
If you need a way for the two to communicate, one of the ways to go is to expose some kind of JSON based endpoint that can be called from one of the domains, while the other polls for a result.
UPD: Regarding your pronto question, I would guess they don't use an iframe. Pronto is a bookmarklet, which allows code to run in the "outer" page. While I didn't verify this, I'd guess they are able to make the browser page load their JS library via an injected script element, and display their UI that way.
Generally, no. This is known as cross-site scripting (XSS) and is considered a security risk, so most browsers prevent it.