jQuery将数据发送到PHP并接收数据

Question

I have a PHP script calling an API which takes a while to load, consequently users do not see the page for a while and believe something went wrong.

I have been informed that a Jquery script can send data to the PHP file, get the resulting data from it and display a loading message/animation while this is being performed. Looking around the Internet I found this:

$.get("check.php", { url: "www.domain.com"}, function(data){
    alert("Data Loaded: " + data);
});

I've not been able to figure out how the PHP file needs to receive the sent data ( $_GET['url'] or otherwise) or how to receive and display the data and how to display a loading message. A lot of questions I know, but I would be very grateful for any information to understand how to do this.

Answer 1

With the help of everyone who responded to this post this is the working result:

<div id="content-area"><p>loading content...</p></div>

<script type="text/jscript">    
    $.get("check.php", { url: "www.domain.com"}, function(data){
    $("#content-area").html(data)
    });
</script>

The PHP receives the data with a GET method and returns data with echo.

Thanks everyone for your help :)

Answer 2

The way to do this is to display a loading message/animation by default and then, once it does get loaded, your jQuery $.get() method would fill in the content.

For check.php to receive the data from jQuery, it gets treated like any other GET request to the script. In this case, it would be like going to check.php?url=www.domain.com and whatever output is generated would get received in the ' data ' parameter.

Answer 3

// On some sort event, here click is used for example
$('button').click(function() {
   // start loading message
   console.log('loading...');
   // start request
   $.get("check.php", { url: "www.domain.com"}, function(data){
       // this part is triggered when request is successful
       console.log('LOADED');
       // shows what was echo'ed on php file
       console.log(data);
   });
});

console.log() show messages in Developer Tools console