<!DOCTYPE html>
<html>

<head>
  <link rel="stylesheet" href="style.css">
  <script src="script.js"></script>
</head>

<body>
  <form id='form1' name='form1' action='' method='post' target='bigIframe'>
    <input id='inData' name='inData'>
    <input id='btn1' type='submit'>
 
  <iframe id='bigIframe' name='bigIframe' src='child.html' width='400' height='300'></iframe>
 </form>

  <script>
    var form1 = document.getElementById('form1');

    form1.addEventListener('submit', function(e) {
      e.preventDefault();
      var bigI = document.getElementById('bigIframe');
      var data = document.getElementById('inData').value;
      var iUser = bigI.contentWindow.document.getElementById('user_name');
      iUser.value = data;
    }, false);
  </script>
</body>

</html>
// Code goes here

/* Styles go here */

<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
  </head>

  <body>
    <input id='user_name' name='user_name'>
  </body>

</html>