Help: Simple auto refresh with ajax/javascript...

I've recently wanting to learn code, so I started learning php, and now I want to start ajax/javascript (For its refreshing abilities...)

I've tried the following code in my site, I don't have a clue how it works (Well it doesnt work! ) I don't have a clue on how its supposed to work!

Could anyone either fix this code or suggest code that could do what I want...
/Or explain the fixed code.

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

<script language="javascript">
var request = new Request({
url: '/live.php',
method: 'get',
update: 'refresh-me',
onComplete: function(response) {
$('/live').set('php',response);
}
})

var doRefresh = function() {
request.send();
};

doRefresh.periodical(5000);
</script>
<div id='divid'></div>


I don't have a clue whats right and whats wrong, please help...

-What I want, I have a page... index.php, i want it to display a box...
(<?php include('live.php'); ?>) which has stuff in...

I want live.php to refresh -in the index.php box, without refreshing the whole page (the index page)

If the code is right, i must have misplaced it in a wrong folder or whatever....

Can anyone share a working code/example,

-Using my file names.
-And yes i uploaded mootools.js in a folder /js/ -I don't really need this if u have a better solution

Thanks alot,

James

 

Any advice at all?

 

It looks like Prototype Ajax. Have you gone to their website http://www.prototypejs.org? You can find some tutorials and tips there.

 

Do you know jquery ? It's a powerful js framework for everything you needed.

 

If you are trying to update 'divid' only,
referring to http://mootorial.com/wiki/mootorial/07-request/01-request.html,
shouldn't your code be just like as follows:

var request = new Request.HTML({
url: '/live.php',
method: 'get',
update: 'divid',
// onComplete: function(response) {
//$('/live').set('php',response);
//}
})

 

I have no idea I'll try it

 

Can anyone give me instructions on where to put this code? what to name it? and what code to put in index.php or live.php?

 

Actually I am in the same position as you are Skillman13,
a greenhorn in mootools too .

But I suppose I could learn new world of javascripting (mootools, jQuery, Ajax etc) by helping you.
Please consult a mootools expert after testing my scripts,

There are two files attached, INDEX.PHP and LIVE.PHP,
and I put them in the same folder as MOOTOOLS.JS on my server.

Good luck.

 

erm.

$('/live').set('php',response); -> this is wrong. the selector cant be /live - it's an invalid id. i doubt it would update anything.

aside from that, the code you have is solid. keep in mind this works on the principles of:

1. html markup
<div id="live">content will be here that gets updated</div>

2. creating a Request object called request in the global namespace and setting it to update the layer above

3. creating a timed function that calls the request.send() method and repeats the request, updating in the process.


there is only one thing i'd change as pointed, use update: $("live") and drop the onComplete event.

also, consider using Request.periodical - http://mootools.net/docs/more/Request/Request.Periodical - it's a part of mootools-more