how to post a field value which is available in iframe in php

Question

How to post iframe value in php.

Example: Username.php

    <form action='data.php' method='post'>
    <input type='text' name='username' id='username'>
    <iframe src='password.php'></iframe>
<input type='submit'>
</form>

Password.php

<input type='text' name='password' id='passwprd'>

I want to post password and username value to data.php

Answer 1

You can do it without session or cookie but with pure javascript.Give your iframe an id.

<iframe id='iframePassword' src='password.php'></iframe>

You can grab username with this

   var username = document.getElementById('username').value;

You can access the password field inside the iframe with this.

var ifr = document.getElementById('iframePassword');
var password = ifr.contentWindow.document.getElementById('passwprd').value;

Now make an ajax call with username and password.

Answer 2

try this,

<form action='data.php' method='post'>
        <input type='text' name='username' id='username'>
        <iframe id="iframe_pass" src='password.php'>

        </iframe>

        <input id="submit" type='button' value="submit">
    </form>
<p id="password_from_frame"></p>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script>
        $("#submit").on('click', function(){

            var pass_field = $("#iframe_pass").contents().find("#password");
            var username = $("#username");

            var data = {username : username.val(), password : pass_field.val()};
// make an ajax call to submit form
            $.ajax({
                url : "data.php",
                type : "POST",
                data : data,
                success : function(data) {
                    console.log(data);
                    alert(data);
                }, 
                error : function() {

                }
            });


        });
// you can use keyup, keydown, focusout, keypress event
    $("#iframe_pass").contents().find("#password").on('keyup', function(){

        $("#password_from_frame").html($(this).val());


    });

    </script>

and password.php

<input type='text' name='password' id='password'>

and on the data.php use the print_r to send back the value to the ajax request

print_r($_POST);