How to access data within an iframe?

Question

I have been trying to access data from an iframe. I am working on codeigniter. I have spent my whole day searching for the solution, but no luck. I am not an expert in javascript, so it is becoming more difficult to me. Please have a look at my code.

home-upload-dialog.php view file

<div id="popup-contents">
    <iframe id="upload-frame" frameborder="0" scrolling="no" height="200" width="100%" src="<?php echo site_url('home/upload_area/' . $_REQUEST['count']);?>"></iframe>
</div>
<input type="button" value="click me" onclick="run()">
<script>
    run() {
        var iframedoc = document.getElementsByTagName('iframe')[0].contentWindow.document;
        var inputs = iframedoc.getElementById('text');
        console.log(inputs);
    }
</script>

home.php controller

upload_area() {
    $data['count'] = $count;
    $this->load->view('upload-area', $data);
}

upload-area.php view file

<!DOCTYPE html>
    <html>
    <head>
        <title>Title here</title>
    </head>
    <body>
        <input type="text" name="text" id="text" value="someValue">
    </body>
    </html>

I get the error saying Uncaught TypeError: Cannot read property 'contentWindow' of undefined There might be things I overlooked. Any help would be appreciated !

I also tried $('iframe').contents().find('#text').html(); but no luck.

Possible duplicate of [How can I access iframe elements with Javascript?](http://stackoverflow.com/questions/1452871/how-can-i-access-iframe-elements-with-javascript) — Charlotte Dunois, Oct 16 '16 at 13:27
I already visited that page and still have the same problem. — Rabin Lama Dong, Oct 16 '16 at 13:33
Just a tip, I tried to fix an issue with a webinterface (which uses frames) a few days ago, I used `window.frames['name_of_the_frame'].document` — Charlotte Dunois, Oct 16 '16 at 13:36
It still says `cannot read property 'document' of undefined` There might be small silly mistakes in my codes. But I have tried many options with no result. — Rabin Lama Dong, Oct 16 '16 at 13:43

score 3 · Accepted Answer · edited May 23 '17 at 12:16

3

There are already many answers to your questions, google "access DOM inside iframe" for several solutions, here is one.

In general remember that you cannot access the iframe data if the iframe is loaded on another domain for security reasons (otherwise imagine the "Like" widget from Facebook, you could load it and then steal the authorization cookie of the users visiting your website...)

EDIT: Note that the security limitation above includes funny situations like your website is loaded from "www.domain.com/page.php" and your iframe from "domain.com/iframe.php", so check that out.

edited May 23 '17 at 12:16

Community

1
1

answered Oct 16 '16 at 13:24

Johnny

1,770
12
16

1

Instead of making an answer pointing to a question answering the exact same question, flag the question as duplicate. – Charlotte Dunois Oct 16 '16 at 13:28
@CharlotteDunois Thanks for the tip, I'm new here :) – Johnny Oct 16 '16 at 13:31
Can you explain what do you mean by another domain ? – Rabin Lama Dong Oct 16 '16 at 13:48
Use "View source" on the page loading the iframe, and compare the part with the URL on top of your browser. – Johnny Oct 16 '16 at 13:49
Ohh okay. So it's in the same domain and I'm still getting the error. Any solutions ? – Rabin Lama Dong Oct 16 '16 at 14:06

How to access data within an iframe?

1 Answers1