Q:

Load external website using Uframe(or something else) in a PHP page and trigger click event on a DOM element?

First of all I know the question may sound rather complex but i hope is not that much.
My goal is the following:
I have a page mypage.php , I have a button(whose ID is button and it's just a div drawn using a css style) in this page. When I click on this button I want to:
1) load the content of an external web site 
2) once the website has completely been loaded : 

a) fulfill a text field in this page with some content (for instance let's say that this page has a input field with id my_field and I want this text fields to contain the text mytext )
b) trigger "click" (or "mousedown") event on a button (a div drawn using a css style). Let's say that this button's id is: external_button
c) finally : reload external website "as standalone". I mean: I want mypage.php to "disappear" and to "move" to the other website as I clicked on a link poiting to that website's url.

Note that this last point is for me optional: the only important thing is that the user will be able to use the loaded website as them wrote its address to browser's url address bar
Structure of mypage.PHP:
<html>
   <body>
      <div class="mybutton" id="mybutton"> </div> <br/>
      <div id="content"></div>
  </body>
</html>

Structure of external website :
 <html>
    <head> <!-- SOMETHING..including styles,javascript,title,metatags etc. --> </head>
      <body>
          <input type="text" id="my_field" value="" /><br/>
          <div class="external_button" id="external_button"> </div>
      </body>
 </html>

I searched the Internet and found this possible solutions (but I don't know how to "combine" nor use them):
1) Load the external website using uframe. First of all I don't understand if I can use PHP or just ASPX. Then I don't understand how it works.
a+b) fulfill the text field and trigger the event: with jquery. I tried it (directly loading the website in my browser) using Chrome Dev Tools but apparently it doesn't work.
$("#external_button").trigger("mousedown")

c) I guess this can be done using header php function (or by using javascript:reload )
Any suggestion is really appreciated.
Thank you in advance.

A:

Chrome and FF honor the Same Origin policy to protect end users from cross scripting attacks.
Hence,you cannot load an external website within an IFrame or a Div contained in your page unless the target website whose page is being loaded allow the page to be loaded within the IFrame.
In case you own the source of the target web site, the following query on SO should provide a pointer on how you can achieve loading the external web page within your DIV
Overcoming “Display forbidden by X-Frame-Options”
However, the problem you are trying to solve can be done as below:
Load the external web page into your DIV and provide a callback function that will work when the load completes as below. The below code must be placed in the JS file for myPage.php:
    //define the call back function that will trigger when the target page loads
    var loadedFunction = function() {
                    alert("Target web page completed loading");
                                            //txtSampleTarget is the name of the text box to be populated.
                    $("#my_field").val("Finished loading");
                                           //perform more javascript actions here.
                                           $("#external_button").trigger('click');

                }
    $(document).ready(function() {
                    $("#loadButton").click(function(event) {
                          $("#contentDiv").load(url, loadCompleteCallback);

                    });
                });

Hope this helps...

