Call php files using JQuery and Ajax

[thereaper87]

Hello there,

 

I have a problem, that I am trying to find some literature about, or maybe an example, or a demo; or just plain help.

 

What I am trying to do, is to have a query ran every 2 seconds, to display a number.

 

Here is what I am trying to implement.

//index.php

<script>
function updateShouts(){
    // Assuming we have #shoutbox
    $('#shoutbox').load('latestShouts.php');
}
setInterval( "updateShouts()", 2000 );
</script>

// to merge that with
// latestShouts.php



$total = mysql_query("SELECT COUNT(*) FROM $table_and_query"); 
        $total = mysql_fetch_array($total); 
        return $total[0]; 

 

I know that will not work, because I really don't know much about ajax. I read all of the tutorials on w3, but they didn't really have an example I was looking for.

 

Any help is appreciated.

 

 

 

[davidmyers]

This is the kind of jQuery AJAX call you're going to want:

 

var data = "&settingone=1&settingtwo=2";
$.ajax({
        url: "index.php?option=dothis",
type: "POST",
data: data,
success: function(string, variable){
	if(variable === "success"){	
	    alert(string);
	}
	else{
	    alert(string);
	}
}
});

 

It's a fairly straightforward piece of code. Data is anything you want to POST (or GET if you change type: to equal GET) to the Url.

The function returns a string and a variable. The variable tells whether or not the AJAX call was successful or not and the string is whatever the Url returned.

 

On it's own this will continuously make AJAX calls to that page.

[thereaper87]

Awesome! Just to be sure, I wrap that in script tags correct?

[Andy11548]

If you want to to refresh, wouldn't something like this work:

 

$(setInterval(function() {
$('#shoutbox').load('latestShouts.php');
}, 2000));

[davidmyers]

Awesome! Just to be sure, I wrap that in script tags correct?

 

Yeah, or include it in an external JS file. Also, make sure you call it inside of:

$(document).ready(function(){

    // jQuery code goes here

});

 

It's just a jQuery thing to make sure it doesn't try to run before the page is finished loading.