PHP variable update using jquery

Question

I am using the following code but I can't seem to get it to work. If anyone could help or point me in the right direction that would be great. What I'm trying to achieve is a facebook style of alert where the alert will appear without refreshing the page. The number of alerts come from the number of rows in the database. Am I doing anything stupid?

jQuery:

<script type="text/javascript">
var alertNumber = <?php echo $display['alertNumber']; ?>;
setTimeout(checkVariableValue, 2000);
function checkVariableValue() {
     $.ajax({
        url: 'jquery.php?query='.alertNumber,
        success: function(newAlert) {
            if (newAlert != alertNumber);
                alertNumber = newAlert;
                document.getElementById("wibble").innerHTML=alertNumber;
            }
     });
}
</script>

Read up 'Long Polling' http://stackoverflow.com/questions/333664/simple-long-polling-example-code — Dunhamzzz, Apr 19 '11 at 14:38
@Groovetrain it does nothing at all apart from duplicate the page within itself. — David, Apr 19 '11 at 14:41
thank you for all your answers they were all helpful, but the main issue was the +alertNumber — David, Apr 19 '11 at 14:52

score 6 · Accepted Answer · answered Apr 19 '11 at 14:40

6

This line

url: 'jquery.php?query='.alertNumber,

Should be

url: 'jquery.php?query='+alertNumber,

answered Apr 19 '11 at 14:40

locrizak

12,192
12
60
80

locrizak do you know how I would go about looping that function so that it keeps on checking say every 5 seconds? – David Apr 19 '11 at 15:10
@David instead of setTimeout you need setInterval. setTimeout will only execute once where setInterval continues until you clear it. – locrizak Apr 19 '11 at 15:14

score 3 · Answer 2 · answered Apr 19 '11 at 14:40

3

url: 'jquery.php?query='.alertNumber,

is in my eyes wrong. it must be url: 'jquery.php?query=' + alertNumber,

answered Apr 19 '11 at 14:40

Reporter

3,897
5
33
47

score 2 · Answer 3 · answered Apr 19 '11 at 14:40

2

Maybe I'm missing something, but I do not see your php page actually echoing any text for your ajax function to read.

answered Apr 19 '11 at 14:40

Dutchie432

28,798
20
92
109

score 1 · Answer 4 · answered Apr 19 '11 at 14:43

My apologies for an answer. Others seemed to have found the issue (or at least one), I just felt this was too dense for a comment.

I would recommend altering your style to have a "read flag" in the database instead of holding on to the last row (or in your case row count) and using that as a discriminator. As the messages grow, you wouldn't want (presumably) hundreds of results dumping through the AJAX call. Also, unless you're presuming that once it's been displayed on the page the user has acknowledged it. (An example would be a last-minute message pops up and the user clicks a link at the same time--now there's no visibility).

Also, if you find the site to be gaining a lot of traffic, it may be worth while looking in to a PUSH service (an article I found quickly googling goes on about it and its benefits)

score 0 · Answer 5 · answered Apr 19 '11 at 14:42

0

Right now your php code doesn't seem to be sending back any response.

Once you get the number of rows in the variable $q, just add this line

echo $q;

You may also need to add dataType option in the ajax request to specify that you are expecting back a response of type text

$.ajax({
        url: 'jquery.php?query='+alertNumber,
        dataType : 'text',
        success: function(newAlert) {
            if (newAlert != alertNumber);
                alertNumber = newAlert;
                document.getElementById("wibble").innerHTML=alertNumber;
            }
     });

answered Apr 19 '11 at 14:42

naiquevin

7,588
12
53
62

`text` is not a valid dataType. Options are `xml`, `json`, `script`, or `html` so it it should be `html` – Dutchie432 Apr 19 '11 at 14:43
Oh, my mistake. I guess `text` is never used in the intelligent guessing, and `html` is used instead. Thanks. – Dutchie432 Apr 19 '11 at 14:47

score 0 · Answer 6 · answered Apr 19 '11 at 14:45

var alertNumber = <?php echo $display['alertNumber']; ?>;
setTimeout(checkVariableValue, 2000);
function checkVariableValue() {
     $.ajax({
        url: 'jquery.php?query='.alertNumber,

see that line on url property? that line isn't inside php script... so you must use a javascript concatenation operator ( + )

PHP variable update using jquery

6 Answers6