PDA

View Full Version : Ajax refresh/get.. help pls!



Hitman
31-08-2009, 02:32 PM
Hi, I'm making a sort of chatbox kinda thing, and I've got it working so you enter your message, it posts it and you can see the last 5 messages. The thing is, to see new messages the page must be refreshed which is annoying, so I want it to automatically update the page with new posts/chats. Using META refresh works, but it's very noticeable on the browser (the loading icon starts moving).

I want to do it with ajax. Problem is, I've never used ajax or javascript (much) so I need help. I've looked on Google, can't find what I want. All it needs to be is something that refreshes "get.php" every second, OR something similar that updates the page with a new post once its posted.

If anybody could give me the code, either written by themselves or found off of Google I'd be so grateful!

Thanks.

BoyBetterKnow
31-08-2009, 02:51 PM
Download this http://code.google.com/p/jqueryjs/downloads/detail?name=jquery-1.3.2.js

Then on your html page at the top (just below your title perhaps) put


<script src="pathtojqueryfile.js" type="text/js"></script>

then make a file called core.js.

Include the core.js just below the jqueryfile.js using the same code.

core.js

function getLatest(){

$.ajax({
url: 'PAGENAME.php',
cache: false,
success: function(data){
$('#LATESTSHOUTSDIVIDGOESHERE').html(data);
}
});

return false;

};

Then I don't know how you are submitting the form but just do onclick="getLatest(); return false;" on the form as you post.

You may want to add to that or perhaps just do the POST on it. I recommend reading the jQuery Documentation (http://docs.jquery.com/Main_Page).

Now in terms of getting the page to auto refresh every x seconds....

Hmm. I guess you would just do a function like the one I said but call it onLoad and then put a setTimeout (http://www.w3schools.com/js/js_timing.asp) and restart the function and so on and so fourth.

None of this is tested sorry.

Blob
31-08-2009, 05:35 PM
Do the above but also edit it to check if the latest message given by the php doesn't equal the last message display, and if so insert the new shout (in a nice fashion or something) otherwise, don't.

BoyBetterKnow
31-08-2009, 06:01 PM
Do the above but also edit it to check if the latest message given by the php doesn't equal the last message display, and if so insert the new shout (in a nice fashion or something) otherwise, don't.

Yeh message ID definately. Good idea tbh.

Hitman
31-08-2009, 10:45 PM
Yeh message ID definately. Good idea tbh.
Thanks both of you. I've found something that works - it was using some dudes javascript stuff and...

new Ajax.PeriodicalUpdater('get', '/uge/get.php', {
method: 'get', frequency: 0, decay: 0
});

Refreshes every second... might be a bandwidth waster, so I'll implement something in PHP where it checks if there are new ones as you said, cheers.

Want to hide these adverts? Register an account for free!