If the framed site is on a different domain, you cannot directly read the value from the remote iframe. Even so, the answer is yes: It is still possible to get that value, by proxying the framed site through your own domain.
For example, in an HTML page on my site I have an iFrame whose contents are sourced from another website. The iFrame content is a single select field.
I need to be able to read the selected value on my site. In other words, I need to use the select list from another domain inside my own application. I do not have control over any server settings.
Initially therefore we might be tempted to do something like this (simplified):
HTML in my site:
<iframe name="select_frame" src="http://www.othersite.com/select.php?initial_name=jim"></iframe>
<input type="button" name="save" value="SAVE">
HTML contents of iFrame (loaded from select.php
on another domain):
<select id='select_name'>
<option value="john">John</option>
<option value="jim" selected>Jim</option>
</select>
jQuery:
$('input:button[name=save]').click(function() {
var name = $('iframe[name=select_frame]').contents().find('#select_name').val();
});
However, I receive this javascript error when I attempt to read the value:
Blocked a frame with origin “http://www.myownsite.com” from accessing a frame with origin “http://www.othersite.com”. Protocols, domains, and ports must match.
To get around this problem, you can proxy the content at “http://www.othersite.com”, hosting it instead on “http://www.myownsite.com”. For example, if you are using PHP, have a PHP script that reads the contents from the other site using a method like file_get_contents()
or curl
etc.
So, create a script (for example: select_local.php
in the current directory) on your own site with contents similar to this:
PHP content of select_local.php:
<?php
$url = "http://www.othersite.com/select.php?" . $_SERVER['QUERY_STRING'];
$html_select = file_get_contents($url);
echo $html_select;
?>
Also modify the HTML to call this local (instead of the remote) script:
<iframe name="select_frame" src="https://stackoverflow.com/questions/15002652/select_local.php?initial_name=jim"></iframe>
<input type="button" name="save" value="SAVE">
Now your browser should think that it is loading the iFrame content from the same domain.