John T
John T

Reputation: 1078

Is it possible to 'echo' a sequence of responses from an ajax call

I'm learning and experimenting with jquery/ajax as I develop a website. I have a page that updates a database. I would like a 'sequence' of responses to display on the screen when the user submits their data (I've seen this done on many other sites).

For instance... user submits form and the page displays: Received Input Checking Database - recond number xy Updating Database Retrieving Information etc etc

This is just an example but you get the idea.

I have an ajax call that is initiated on 'click' of the submit button (getFormData just serialises all the form data for me and works fine):

var toSend = getFormData($upgrade_db_form);
var formMessageBox = $("#displayResults");

$.ajax({
         url: ajaxurl,
         data: {
             action: "database_action",
             formData : toSend
         },
         type: 'POST',
         dataType: 'TEXT',
         beforeSend: function() {
             //$form.fadeOut('slow');
             formMessageBox.html("starting it up");
         },
         success: function (data) {
            formMessageBox.empty();
            formMessageBox.html(data);
         error: function (xhr) {
            // formMessageBox.html("Oops error!");                     
         }

 });

I have a function which gets called by ajax:

function upgrade_database_function() {
    echo "testing ";

    for($i = 0; $i < 99; $i++) {
        echo "percent complete ".$i."%";
    }

    echo "done ";
    die(); // this is required to return a proper result
}

I'm using Wordpress and all the ajax side of things works fine, it passes the form data correctly etc, it's just that I get one long output as though it's cache'ing all the echo's up instead of outputting them in sequence.

I've gone through the jquery ajax documentation and couldn't find how to make it behave the way I want it to. I can live with it the way it is but I think it would look a lot better if I could get it working the way I would like.

Can this be done this way or do I need lots of sequential ajax calls to make it work?

Upvotes: 0

Views: 143

Answers (1)

jwwishart
jwwishart

Reputation: 2895

I don't know PHP, but i'm guessing that the echo is just writing to the response buffer... so when all the echos are done the whole response will be returned and you would get the effect that you are seeing... You would need to go with a polling system or something along those lines to get the latest status' from the server and display them I would think... Maybe there is some system in PHP that allows this, but as I said, I don't know PHP.

An Example of Long Polling can be found in this article. http://www.abrandao.com/2013/05/11/php-http-long-poll-server-push/

WARNING: You may have to do some manual managing of locking of the session in PHP so that your long running call doesn't lock your polling ajax calls: See here:

http://konrness.com/php5/how-to-prevent-blocking-php-requests/

Note that you would likely be wanting to:

  • create one ajax call that starts the execution of some coded that will take a while... you could put messages that have been generated into a session variable for example in a list of some sort. You would need to lock/unlock the session as mentioned to prevent suspension of AJAX polling calls.
  • you would create a polling method like in the article that might check the session every 500ms or something to see whether there are any more messages, lock the session, remove those messages and return those messages to the client side and display them.

WARNING: Again, I'm not a PHP person, I may have done this once in my life in PHP (can't remember exactly) but I may be wrong and this may not work, from what I've seen though it looks like it is achievable. Hope this gets you on your way!

Upvotes: 2

Related Questions