1

I'm fetching emails via Gmail API and storing some details like: message snippet, date, sender etc and showing a list on page using that data. I'm successfully getting data from API and storing in DB. But data appears on page only when request is finished and page got reloaded. I want to make it that way that as emails are getting entered into DB, they should appear on page. No matter request is completed yet or not, but DOM should get updated as data coming into DB. My Ajax call looks something like this.

$.ajax({
    method: 'post',
    url:'refreshMailBox.php',
    data:{userId:'<?php echo $email;?>'},
    beforeSend: function () {
        $("#refreshMsg").html("<img src='images/ajax-loader.gif' alt='...'>&nbsp;<b>Loading...</b>");
    },
    success: function (response) {
        res_obj = JSON.parse(response);
        $("#refreshMsg").html("");
        totalEmails = res_obj.totalEmails;
            var url = window.location.href;
            window.history.pushState("", "", url);
            location.href = url;
        },
        error: function (err) {
            console.log(err);
        },
});

Please give me idea about how can I update DOM as data enters into DB. it doesn't matter ajax call completed or not. We should be seeing in DB data to check if new emails came then add them in listing div. Thanks

Asad ullah
  • 620
  • 2
  • 9
  • 26
  • You need to either have your script poll periodically (easy to implement, but not ideal), or use web sockets (harder to implement, but technically a better solution). – Patrick Q Apr 20 '18 at 19:11
  • poll periodically means keep checking for DB changes via ajax call continuously at some time interval? – Asad ullah Apr 20 '18 at 19:16
  • Yes, that's what it means – Patrick Q Apr 20 '18 at 19:17
  • I know this not the code writing community. But I'll be very very grateful if you can just update my above code to make a nested ajax call. I'm little beginner in this stuff so can't figure out even after days of trying. Thanks – Asad ullah Apr 20 '18 at 19:29
  • Possible duplicate [How to fire AJAX request Periodically?](https://stackoverflow.com/questions/5052543/how-to-fire-ajax-request-periodically) and [this](https://stackoverflow.com/questions/22577457/update-data-on-a-page-without-refreshing), [this](https://stackoverflow.com/questions/28480728/how-can-i-continuously-update-a-php-variable-without-refreshing-a-page), [this](https://stackoverflow.com/questions/28125226/how-to-update-content-automatically-without-reloading-webpage-using-php-ajax) and [this](https://stackoverflow.com/questions/10492256/how-to-continuously-update-a-part-of-the-page) – Patrick Q Apr 20 '18 at 19:30

0 Answers0