1

I need to populate a text input field on the parent page from a button click inside an iframe (same domain). I've been using the following to accomplish the opposite (parent to iframe) but I'm not sure how to reverse the process. Any help would be appreciated.

parent.html:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
    $(document).ready(function(){
        $('#submit').click(function(){
            var iframe = document.getElementById('myiframe');
            var doc = iframe.contentDocument || iframe.contentWindow.document;
            var elem = document.getElementById('username');
            doc.getElementsByName('user')[0].value = elem.value;
        });
    });
</script>

<body>
<input type="text" id="username">
<input type="submit" id="submit">
<iframe id="myiframe" frameborder="1" src="child.html"></iframe>
</body>

child.html:

<body>
<input type="text" name="user" id="user">
</body>
Mandrake Slink
  • 45
  • 5
  • 1
    This appears to be a duplicate of [Access elements of parent window from iframe](https://stackoverflow.com/questions/7027799/access-elements-of-parent-window-from-iframe). – Booboo Aug 25 '19 at 10:53
  • Not a duplicate because that page is discussing how to populate a
    with a url, and btw it doesn't work. My example does work, just in the reverse order I prefer, and it's populating text inputs instead of divs.
     – Mandrake Slink Aug 26 '19 at 00:20

0 Answers0