How to use setInterval() when there's a param?

Question

I'm trying to get a single div on a php page to refresh every 5 seconds.

In HTML I have: EDIT: NEW SCRIPT FUNCTION

<script>
     $(document).ready(function(){
        var callAjax = function(){
            $.ajax({
                method:'get',
                url:'game.php',
                success:function(data){
                    $("#read_chat").html(data);
                }
            });
        }
        setInterval(callAjax, 5000);
     });
</script>

And the function (in a php block) I'm trying to refresh is:

echo" <div class='read_chat' >";
   function get_messages($db){
       //get messages
       $get_m = "select user_name, message, time, character_name from Chat NATURAL JOIN User LEFT OUTER NATURAL JOIN Character where Chat.game_id =".$_SESSION[game_id]." ORDER BY Chat.chat_id;";
       $messages = $db->query($get_m);

       //display messages
       foreach ($messages as $row) {
           //display each message in row
           if ( $row['character_name'] == NULL){
                echo "<div class='left'>" . $row['user_name'] . ": </div>";
           }
           else {
                echo "<div class='left'>" . $row['character_name'] . ": </div>";
           }
           echo "<div class='center'>" . $row['message'] . "</div>";
           echo "<div class='right'>" . $row['time'] . "</div>";
        }
   }
echo "</div>";

The display of this is only the CSSed block without any content. If I just call get_messages($db) all the chat from the database loads. How do I make this div refresh automatically? Thanks!

EDIT: The name of the file is "game.php" and the php function is "get_messages()".

For the record I looked at: http://www.elated.com/articles/javascript-timers-with-settimeout-and-setinterval/

and

Pass parameters in setInterval function

you should use ajax to update your div with the new data from php — vasilenicusor, May 01 '15 at 23:59
`get_messages` is a PHP function. PHP runs first then is rendered with CSS, HTML, JS. JS doesn't execute PHP functions. To get this to work use AJAX. — Class, May 02 '15 at 00:00

score 0 · Answer 1 · answered May 02 '15 at 00:15

Javascript

setTimeout(function(){
    $.ajax({url: "get_message.php", success: function(result){
        var num_records = result.length,
            i,
            content;
            for(i=0;i<num_records;i++){
                if (result[i]['character_name'] !== null){
                    content += "<div class='left'>" + result[i]['character_name'] +": </div>";
                }
                else{
                    content += "<div class='left'>" + result[i]['user_name'] +": </div>";
                }
                content += "<div class='center'>" + result[i]['message'] + "</div><div class='right'>" + result[i]['time'] + "</div>";
            }

        $('.read_chat').html(content);

    }});
 }, 5000);

get_message.php

$get_m = "select user_name, message, time, character_name from Chat NATURAL JOIN User LEFT OUTER NATURAL JOIN Character where Chat.game_id =".$_SESSION[game_id]." ORDER BY Chat.chat_id;";
$messages = $db->query($get_m);
$response = array();
foreach ($messages as $row) {
    $response[] = $row;
}
echo json_encode($response);

Thank you! What if the file isn't 'get_message.php'? The function is get_message(), but the file name is game.php — swallis1, May 02 '15 at 00:46
you cannot call php functions from javascript. To use data/functions from php you must use ajax request(like a browser access your php file) to get te result. Please see here a more detailed example http://labs.jonsuh.com/jquery-ajax-php-json/ . You can use the same file game.php but you must check if the file is called by ajax or browser. you can add GET parametter game.php?ajax and in php check if(isset($_GET['ajax']) then you should return ajax data and only this data — vasilenicusor, May 02 '15 at 00:51

filype · Answer 2 · 2015-05-02T01:22:07.043

0

I'd suggest using jQuery $.load, see the example below:

setTimeout(function(){
    $('.read_chat').load('get_message.php');
}, 5000);

You'll need to return nice html from the PHP script instead, but it's cleaner.

edited May 02 '15 at 01:22

answered May 02 '15 at 01:13

filype

8,034
10
40
66

What error did you get? The file `get_message.php` needs to return HTML instead of JSON – filype May 02 '15 at 01:22

How to use setInterval() when there's a param?

2 Answers2