Ajax PHP MySQLI - Get Last Updated row, but NOT on document ready

Question

Here's the situation.

I have a database with the following columns: id, last_updated, class, name, score, active, bonus - all of which serve a purpose of other things other than what I need assistance with. the page I have, calls a jQuery function that launches an ajax call to the database sorts the table by last_updated, picks the first one and displays the results on the page every so often.

The thing I'm wondering about is if there is a way to call the function on document ready, but not execute it until the first update to the database?

DATABASE:

|  id  |    last_updated     |  class  |  name  |  score  |  active  |  bonus  |
|  1   | 2017-05-02 11:45:06 | classA  | name01 |    0    |     1    |    0    |
|  2   | 2017-05-02 11:44:18 | classB  | name02 |    0    |     1    |    0    |
|  3   | 2017-05-02 11:43:58 | classC  | name03 |    0    |     1    |    0    |
|  4   | 2017-05-02 11:43:47 | classD  | name04 |    0    |     1    |    0    |

JS:

$(document).ready( function() {  
      pingScores();
    });

    var timestamp = null;
    var lastNotificationIdentifier = timestamp;

    function pingScores() {               
        $.ajax({ 
            type: "GET",
            url: "getUpdate.php",
            cache: false,
            async: true,            
            success: function(data){
                var json = eval('(' + data + ')');  
                var notinyClass = json[2];
                var notinyName = json[3];
                var localIdentifier = json[1] + json[0];
                if (localIdentifier !== lastNotificationIdentifier) {
                    if (json[6] == 0){
                        $.notiny({ text: notinyName+"<span class='addScore'> +10</span>", width: '100%', image: notinyClass });
                        lastNotificationIdentifier = localIdentifier;
                    }
                }

                setTimeout("pingScores()", 10);
            }
        });
    };

PHP:

<?php

    require "config.php";

    $sql = "SELECT * FROM roster ORDER BY last_updated DESC LIMIT 1";

    $result = $conn->query($sql);
    $array = mysqli_fetch_row( $result );

    echo json_encode($array);

    $conn->close();
 ?>

I know that what I have does exactly what I don't want it to do, but I don't really know how to execute it the way I want to, where I initialize the ajax call, then execute on database update.

Thanks in advance.

You have to consider using websockets in order to inform the frontend of a change on the backend — nikos.svnk, May 04 '17 at 14:31
I have considered websockets. I would prefer to go this route since this database and code will be living on an XAMPP server locally. — Murphy1976, May 04 '17 at 14:33
Sounds like [long polling](http://stackoverflow.com/questions/11077857/what-are-long-polling-websockets-server-sent-events-sse-and-comet) might work for you. — James, May 04 '17 at 14:34

score 0 · Answer 1 · answered May 04 '17 at 15:16

OK.. this was actually easier than I thought....

I simply set an initLoad variable to TRUE on document ready, and then the first tie the ajax call runs, it checks to see if it is true, then set it to FALSE then set the lastNotificationIdentifier to the localIdentifier, then proceed as scheduled.

Here's modified JS:

$(document).ready( function() {  
      pingScores();
    });

    var initLoad = true;
    var timestamp = new Date().toISOString().slice(0, 19).replace('T', ' ');;
    var lastNotificationIdentifier = timestamp;

    function pingScores() {               
        $.ajax({ 
            type: "GET",
            url: "getUpdate.php",
            cache: false,
            async: true,            
            success: function(data){
                var json = eval('(' + data + ')');  
                var notinyClass = json[2];
                var notinyName = json[3];
                var localIdentifier = json[1]+json[0];

                if (initLoad){
                    initLoad = false;
                    lastNotificationIdentifier = localIdentifier;
                } else {
                    if (localIdentifier !== lastNotificationIdentifier) {
                        if (json[6] == 0){
                            $.notiny({ text: notinyName+"<span class='addScore'> +10</span>", width: '100%', image: notinyClass });
                            lastNotificationIdentifier = localIdentifier;
                        }
                    }
                }

                setTimeout("pingScores()", 10);
            }
        });
    };

This is achieving the result I'm looking for. the function is initialized on document ready, then sent on it's interval loop, but never executes the display when the page first loads.

Ajax PHP MySQLI - Get Last Updated row, but NOT on document ready

1 Answers1