Ajax to run a php function on an interval...

[tanyril]

This is on an SMF forum with tinyportal installed. I'm trying to set up the shoutbox to refresh every few seconds... Here's the code to print the function:

include("../tp-files/tp-modules/TPShout/Sources/TPShout.php");
echo tpshout_fetch();

 

I'm not much of an Ajax expert, so i dug around a little and tried to adapt some code to fit my needs... here's what i ended up with:

 

include("../tp-files/tp-modules/TPShout/Sources/TPShout.php");
echo '<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript">
  //Start the timer when the page is done loading:
  $(function(){
    //Run it immediately
    tpshout_fetch();
    //Start timer
    setInterval(\'tpshout_fetch()\',5000); //I used 5 seconds for testing
  });
</script>
<span id="shouttest"></span>';

Which just returns a blank div.

 

I've looked on here and a couple of other places but haven't had any success in making the code fit what i'm trying to do.

What i need is really just to return the tpshout_fetch() every few seconds. Can anyone help me out? Thanks!

[trq]

Your not actually using any ajax at all in your script.

 

http://api.jquery.com/jQuery.ajax/

[tanyril]

Fair enough, I'll chalk that up to my inexperience in java/ajax. Here's an a script I've got working that updates a DIV with the contents of a page:

 

var recentseconds = 30;
var recentdivid = "recent";
var recenturl = "topics.php";

////////////////////////////////
//
// Refreshing the DIV
//
////////////////////////////////

function refreshrecent(){

// The XMLHttpRequest object

var xmlHttprecent;
try{
xmlHttprecent=new XMLHttpRequest(); // Firefox, Opera 8.0+, Safari
}
catch (e){
try{
xmlHttprecent=new ActiveXObject("Msxml2.XMLHTTP"); // Internet Explorer
}
catch (e){
try{
xmlHttprecent=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e){
alert("Your browser does not support AJAX.");
return false;
}
}
}

// Timestamp for preventing IE caching the GET request

fetch_unix_timestamp = function()
{
return parseInt(new Date().getTime().toString().substring(0, 10))
}

var recenttimestamp = fetch_unix_timestamp();
var recentnocacheurl = recenturl+"?t="+recenttimestamp;

// The code...

xmlHttprecent.onreadystatechange=function(){
if(xmlHttprecent.readyState==4){
document.getElementById(recentdivid).innerHTML=xmlHttprecent.responseText;
setTimeout('refreshrecent()',recentseconds*1000);
}
}
xmlHttprecent.open("GET",recentnocacheurl,true);
xmlHttprecent.send(null);
}

// Start the refreshing process

var recentseconds;
window.onload = function startrecentrefresh(){
setTimeout('refreshrecent()',recentseconds*1000);
}

 

Is there any way i can change this to just run the php function instead of loading a whole page (I tried calling the function on it's own .php page but having some sessioning and authentication issues)

[tanyril]

Do you think it would work if i changed

document.getElementById(recentdivid).innerHTML=xmlHttprecent.responseText;

to be

document.getElementById(recentdivid).innerHTML= "<?php echo tpshout_fetch(); ?>"?

 

[seventheyejosh]

Is it a simple html file you are loading? Maybe with some vars?

 

<script type="text/javascript" src="jquerypath.js"></script>
<script type=" js ">

$(document).ready(function(){

     getShoutOut();

});

function getShoutOut(){

     var param1='test'; //get vars if ur passing them
     $("#recentDivId").load('some_file.php?param1='+param1); //load some remote html

     setTimeout(function(){getShoutOut();},5000); //re run it

}//end function

</script>

<div id="recentDivId"></div>