Day Recipe Food Community

«
»


April 1, 2008

PHP + Ajax auto refresh DIV

Filed under: miscellaneous — Tags: , , , , — Anna @ 11:40 pm

File xmlhttp.js
var xmlhttp = false ;


if (!xmlhttp && typeof XMLHttpRequest != ‘undefined’)
{
try {
xmlhttp = new XMLHttpRequest ();
}
catch (e) {
xmlhttp = false}
}


function myXMLHttpRequest ()
{
var xmlhttplocal;
try {
xmlhttplocal = new ActiveXObject (“Msxml2.XMLHTTP”)}
catch (e) {
try {
xmlhttplocal = new ActiveXObject (“Microsoft.XMLHTTP”)}
catch (E) {
xmlhttplocal = false;
}
}

if (!xmlhttplocal && typeof XMLHttpRequest != ‘undefined’) {
try {
var xmlhttplocal = new XMLHttpRequest ();
}
catch (e) {
var xmlhttplocal = false;
}
}
return (xmlhttplocal);
}

var mnmxmlhttp = Array ();
var mnmString = Array ();
var mnmPrevColor = Array ();
var responsestring = Array ();
var myxmlhttp = Array ();
var responseString = new String;

var i=0;
var ii = 0;
function ajax_update()
{
url = “ajax_php.php”;
target2 = document.getElementById (‘content’);
ii = i++;

var content = “i=” + ii ;

mnmxmlhttp = new myXMLHttpRequest ();
if (mnmxmlhttp) {
mnmxmlhttp.open (“POST”, url, true);
mnmxmlhttp.setRequestHeader (‘Content-Type’,
‘application/x-www-form-urlencoded’);

mnmxmlhttp.send (content);
errormatch = new RegExp (“^ERROR:”);

target2 = document.getElementById (‘content’);

mnmxmlhttp.onreadystatechange = function () {
if (mnmxmlhttp.readyState == 4) {
mnmString = mnmxmlhttp.responseText;

if (mnmString.match (errormatch)) {
mnmString = mnmString.substring (6, mnmString.length);

target = document.getElementById (‘content’);
target2.innerHTML = mnmString;

} else {
target = document.getElementById (‘content’);
target2.innerHTML = mnmString;

}
}
}
}
setTimeout(‘ajax_update()’, 20000);
}

File ajax_php.php

<?PHP
echo “<PRE>”;
print_r($_POST);
echo time();
?>

File test.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PHP + Ajax auto refresh DIV</title>
<script language="JavaScript" type="text/javascript" src="xmlhttp.js"></script>
</head>
<body onload="ajax_update();">
<divid="content">Loading....</div>
</body>
</html>

I tested these three scripts more than 10 times, it's works.
please just replace the ' “  ' with '  "  '

Or download the script here.ajax auto refresh script download

  • Share/Bookmark

Related posts:

  1. Curry-Spiced Citrus and Avocado Salsa Recipe

28 Comments »

  1. this is all i get:

    Array
    (
    [i] => 1
    )
    1217961577

    where the numbers increase

    Comment by steve — August 5, 2008 @ 2:02 pm

  2. can you show me your source code?

    Comment by admin — August 5, 2008 @ 9:18 pm

  3. I modified the code a little bit. I need to have different divs pulling out data from a database and then auto-refresh. I created another div and played around with your code, but I couldn’t get it to work with two different divs.
    Any suggestions?

    [code]

    PHP + Ajax auto refresh DIV

    var xmlhttp = false ;

    if (!xmlhttp && typeof XMLHttpRequest != 'undefined')
    {
    try {
    xmlhttp = new XMLHttpRequest ();
    }
    catch (e) {
    xmlhttp = false}
    }

    function myXMLHttpRequest ()
    {
    var xmlhttplocal;
    try {
    xmlhttplocal = new ActiveXObject ("Msxml2.XMLHTTP")}
    catch (e) {
    try {
    xmlhttplocal = new ActiveXObject ("Microsoft.XMLHTTP")}
    catch (E) {
    xmlhttplocal = false;
    }
    }

    if (!xmlhttplocal && typeof XMLHttpRequest != 'undefined') {
    try {
    var xmlhttplocal = new XMLHttpRequest ();
    }
    catch (e) {
    var xmlhttplocal = false;
    }
    }
    return (xmlhttplocal);
    }

    var mnmxmlhttp = Array ();
    var mnmString = Array ();
    var mnmPrevColor = Array ();
    var responsestring = Array ();
    var myxmlhttp = Array ();
    var responseString = new String;

    var i=0;
    var ii = 0;

    function ajax_update()
    {

    url = "ajax_php.php";
    target2 = document.getElementById ('content');

    ii = i++;

    var content = "i=" + ii ;

    mnmxmlhttp = new myXMLHttpRequest ();
    if (mnmxmlhttp) {
    mnmxmlhttp.open ("POST", url, true);
    mnmxmlhttp.setRequestHeader ('Content-Type',
    'application/x-www-form-urlencoded');

    mnmxmlhttp.send (content);
    errormatch = new RegExp ("^ERROR:");

    target2 = document.getElementById ('content');

    mnmxmlhttp.onreadystatechange = function () {
    if (mnmxmlhttp.readyState == 4) {
    mnmString = mnmxmlhttp.responseText;

    if (mnmString.match (errormatch)) {
    mnmString = mnmString.substring (6, mnmString.length);

    target = document.getElementById ('content');
    target2.innerHTML = mnmString;

    } else {
    target = document.getElementById ('content');
    target2.innerHTML = mnmString;

    }
    }
    }
    }

    setTimeout('ajax_update()', 2000);
    }

    function ajax_update2()
    {

    url = "ajax_php.php";
    target2 = document.getElementById ('content2');

    ii = i + 5;

    var content = "i=" + ii ;

    mnmxmlhttp = new myXMLHttpRequest ();
    if (mnmxmlhttp) {
    mnmxmlhttp.open ("POST", url, true);
    mnmxmlhttp.setRequestHeader ('Content-Type',
    'application/x-www-form-urlencoded');

    mnmxmlhttp.send (content);
    errormatch = new RegExp ("^ERROR:");

    target2 = document.getElementById ('content2');

    mnmxmlhttp.onreadystatechange = function () {
    if (mnmxmlhttp.readyState == 4) {
    mnmString = mnmxmlhttp.responseText;

    if (mnmString.match (errormatch)) {
    mnmString = mnmString.substring (6, mnmString.length);

    target = document.getElementById ('content2');
    target2.innerHTML = mnmString;

    } else {
    target = document.getElementById ('content2');
    target2.innerHTML = mnmString;

    }
    }
    }
    }

    setTimeout('ajax_update2()', 1000);
    }

    Loading...
    Loading...

    [/code]

    Comment by Eric — August 14, 2008 @ 3:24 pm

  4. Never mind! I figured out!!
    Thanks for the code, it’s exactly what I needed!

    Comment by Eric — August 14, 2008 @ 4:27 pm

  5. Sorry but this won’t work, it just says Loading and doesn’t show the time or even show the php script (which I checked, it is working). I did replace the “.

    If anyone has the working script please send it me! Thanks!

    Comment by ap — August 22, 2008 @ 7:37 am

  6. can you download the zip files and test again?

    Comment by admin — August 22, 2008 @ 10:23 pm

  7. In the download file some of the characters in the code changes, but even when i change them it still does not work.

    Comment by Marlon Daley — October 5, 2008 @ 10:26 pm

  8. Hi, i would really appreciate your help, it is not working. Could you write to my email and send those files. In the zip files are messed up. Thanks

    Comment by Simba — October 8, 2008 @ 4:17 pm

  9. hi;

    i needed the same script ( the one with the multiple DIV’s) can some one send me the zip files./

    thanks

    Comment by jeff salam — December 9, 2008 @ 1:02 pm

  10. qjvjsfcouyzyfrsawell, hi admin adn people nice forum indeed. how’s life? hope it’s introduce branch ;)

    Comment by Nemieffiday — December 29, 2008 @ 9:56 am

  11. Your download files messed up.

    Comment by Ryan — January 25, 2009 @ 9:44 am

  12. Very nice. Now if there were only a way to be able to have multiple displays with the same refresh for each.

    Comment by Lil — January 31, 2009 @ 1:49 am

  13. hi! i got same error as Eric had earlier –

    Array
    (
    [i] => 19
    )
    1233969574

    please help me to out of it….

    Comment by Rabin Sharma — February 6, 2009 @ 5:24 am

  14. great little script here! but i am also in need of figuring out how to get this to work with multiple divs! i’ve been playing around with everything.. trying to rename variables… i can not figure it out- Eric or anyone else.. can you offer some advice?

    Comment by ted — February 22, 2009 @ 3:20 am

  15. aha! i found it! a basic modification of the script.. that i thought i had tried creating myself- but guess i had something wrong…

    http://bytes.com/topic/javascript/answers/851117-one-ajax-script-check-one-file-if-something-change-do-refresh-other-file#post3413737

    once you use that JS script.. just make sure you add the additional ‘onload’ function:

    onload=”ajax_update_div1(); ajax_update_div2()”

    goodluck

    Comment by ted — February 22, 2009 @ 4:09 am

  16. All of these AJAX/PHP scripts work great when you’re getting the time. But what about loading a page that’s calling data from a database? I’ve yet to find a script that can overcome the caching problem. Got any ideas on that? I’ve had no problem with the ASP equivelent, but my PHP version always caches the page. I have to load the page in a separate window and refresh it to get it to auto refresh inside the AJAX code.

    Comment by mystic7 — April 13, 2009 @ 5:46 pm

  17. It’s works! After you follow this step:

    step 1: After download the zip file you must rename the “ajax_javascript.js” to “xmlhttp.js”.

    step:2 Change all code at file “test.html” with this code:

    PHP + Ajax auto refresh DIV

    Loading….

    Nice.

    Comment by Alqamar — July 15, 2009 @ 10:43 pm

  18. EDIT : STEP 2:

    step2: Change all code at file “test.html” with File test.html above.

    Comment by Alqamar — July 15, 2009 @ 10:50 pm

  19. good job …. !. it’s work . you just check the test.html file.

    replace this code : Loading….

    with :
    Loading….

    thanks in advanced

    Comment by bhudaya — September 1, 2009 @ 12:29 am

  20. good job …. !. it’s work . you just check the test.html file.

    replace this code :
    ‘Loading….’

    with :
    ‘Loading….’

    replace oid with div

    thanks in advanced

    Comment by bhudaya — September 1, 2009 @ 12:35 am

  21. where is step2 edited? i can’t see it

    Comment by bayu — September 2, 2009 @ 1:40 am

  22. Hi
    This code is ok. Only dishonour slovak diacritic marks. How this shall change please?

    Comment by jurov — September 12, 2009 @ 6:39 pm

  23. Thanks for the script. I have included it in a cgi I have written. I’m using it to auto refresh ajax content and it works great.

    - kris

    Comment by ablyss — September 13, 2009 @ 10:49 pm

  24. Work like charm.. nice..
    i change
    setTimeout(‘ajax_update()’, 20000); to
    setTimeout(‘ajax_update()’, 200);

    Comment by kuya — December 8, 2009 @ 5:06 am

  25. Hi, the script work fine, just I change…

    this:

    Loading….

    for this

    Loading….

    this is the problem:
    <div id

    best regards

    T.

    Comment by Tom McCoffee — December 23, 2009 @ 6:12 am

  26. I put the summary of how I had it work here to help those after me.

    1) the downloaded files are messed up so copy the code posted on top there are 3 files in total, but you will need only 2 either a combination of File xmlhttp.js and test.html or File xmlhttp.js and File ajax_php.php , it is up to you want html page or php page respectively.

    2) Make sure the path and the xmlhttp.js file on test.html or ajax_php.php are set and named correctly, and make sure the characters (‘) and (“) are proper in the xmlhttp.js file.

    3) load the page and you will see the result changing after a preset second on this line setTimeout of xmlhttp.js file.

    4) Say thanks to those who help you …

    Comment by DUNLE — February 8, 2010 @ 4:47 am

  27. For those of you having caching problems, here’s how I fixed the problem. If you add a variable to the php page the browser will assume it’s a new page and not display a cached version, so I added this to the code:
    var currentTime = new Date();
    url = “ajax_php.php?req=”+currentTime.getTime();

    This should fix the cached browser problem.

    Comment by Loo — March 15, 2010 @ 8:59 am

  28. Hi
    Just what i want too – thanks!
    I got the script working fine but i have a javascript file that generates data for me.
    adding

    to the ajax_php.php file (yes above the <?php tag) the script will not run although if i just run the ajax_php.php file alone it works perfectly showing the data.

    I would love to get this working if possible – and any suggestions would be very gratefully received

    Best regards
    Tony Ayling
    Brisbane
    Australia

    Comment by Tony Ayling — April 7, 2010 @ 6:25 pm

RSS feed for comments on this post. TrackBack URL

Leave a comment

You must be logged in to post a comment.

Powered by WordPress