Joe
Joe

Reputation: 43

Refreshing my php page with AJAX every 5 seconds

I'm creating a link-sharing website and on my index.php page (the page I want to refresh every 5 seconds) there are posts/links that must appear automatically (AJAX refreshing) without the user to refresh by him/herself or pressing F5 the whole time.

How would this work, precisely?

Upvotes: 2

Views: 6404

Answers (4)

Mark
Mark

Reputation: 502

Is there a need to use AJAX? Unless I'm missing something; you could use the meta refresh tag:

<meta http-equiv="refresh" content="5">

I would recommend increasing the time between refreshes as this will put a heavier load on the server and may cause to freeze, or slow down the site.

Upvotes: 1

Genjuro
Genjuro

Reputation: 7735

you have to user the setInterval method to call your ajax function to inject new content into your div:

  <HTML>
    <HEAD>
    <TITLE>Hello World Page</TITLE>
    <script language="JavaScript">

        function xmlhttpPost(strURL) {
            var xmlHttpReq = false;
            // Mozilla/Safari
            if (window.XMLHttpRequest) {
                xmlHttpReq = new XMLHttpRequest();
                if (xmlHttpReq.overrideMimeType) {
                    xmlHttpReq.overrideMimeType('text/xml');
                    // See note below about this line
                }
            // IE
            } else if (window.ActiveXObject) { // IE
                try {
                    xmlHttpReq = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try {
                    xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
                } catch (e) {}
                }
            }
            if (!xmlHttpReq) {
                alert('ERROR AJAX:( Cannot create an XMLHTTP instance');
                return false;
            }   
            xmlHttpReq.open('GET', strURL, true);
            xmlHttpReq.setRequestHeader('Content-Type', 
                'application/x-www-form-urlencoded');        
            xmlHttpReq.onreadystatechange = function() { 
                callBackFunction(xmlHttpReq); 
            };
            xmlHttpReq.send("");
        }

        function callBackFunction(http_request) {
            if (http_request.readyState == 4) {
                if (http_request.status == 200) {
                    var responceString = http_request.responseText;
                    //TODO implement your function e.g.
                   document.getElementById("myDiv").InnerHTML+ = (responceString);
                } else {
                    alert('ERROR: AJAX request status = ' + http_request.status);
                }
            }
        }
      setInterval("xmlhttpPost('test.php')", 5000);
    </script>
    </HEAD>
    <BODY>
    Hello World

    <div id="myDiv"></div>
    </BODY>
    </HTML>

Upvotes: 1

deepinit
deepinit

Reputation: 1

Use setInterval(myAjaxCallbackfunction,[time in ms]). Callback uses property of js that function are first class members(can be assigned to variables), and can be passed as argument to function for later use.

Upvotes: 0

JMax
JMax

Reputation: 26591

You should use the setInterval javascript function to deal with this issue.

setInterval(callServer, REFRESH_PERIOD_MILLIS);

See:

Upvotes: 4

Related Questions