Jump to content
  • Advertisement
Sign in to follow this  
Eliia

[web] AJAX 101

This topic is 4113 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

Hi all, I've been toying with AJAX and really like it - but I'm having an issue. I want to update the text on a web page - say like 'new message has arrived'. So I query the db and get back the right value, and it works the first time.... but then document.write won't do it again - because the page is static HTML All the examples I've seen are using textareas which are easily updatable... any ideas pls Also, I'm using JS timer code to trigger my AJAX connection every 10 secs to check for new messages - is there a better way to do this, and I just haven't found out yet :) Also, I want to have many values refreshed on the page every 10 secs, I assume I can use the AJAX connection code once and just call it many times in the page? Can someone point me to an example of this pls? thx Rob/Eliia

Share this post


Link to post
Share on other sites
Advertisement
document.getElementById('some_element_id').innerHTML = the_HTML_to_replace_the_element_contents_with;

Share this post


Link to post
Share on other sites
Don't use innerHTML. It's only supported by IE. You should use the DOM to create elements in the tree.

Share this post


Link to post
Share on other sites
could someone please post something on DOM - I'm so used to just having a PHP page that can refresh, this is all so new to me :)

It sounds like I can manipulate the page even after it is loaded using AJAX? Is that right? All I've seen is updating values in form fields... I'd like to update text, swap image names and make them show etc

Share this post


Link to post
Share on other sites
Quote:
Original post by Sander
Don't use innerHTML. It's only supported by IE.
That doesn't seem quite right - it works for me in at least IE, Firefox, Opera and Konqueror, and apparently Safari too, so it appears to be as well supported as any feature. It's not a W3C standard but it's being specified as part of HTML5. (But it's not entirely interoperable when you use it in certain unusual ways, and it's particularly confusing if you try to build it up in fragments since the browsers automatically close tags in inconsistent ways, so the DOM methods are probably safer (but harder to use).)

Share this post


Link to post
Share on other sites
I wasn't aware of it before but innerText actually seems to work in Opera and Konqueror too, just not in Firefox. But Firefox has no intention of adding it, and nobody is writing a proper specification for it, presumably since the W3C DOM's textContent performs the same role.

Quote:
Also, I'm using JS timer code to trigger my AJAX connection every 10 secs to check for new messages - is there a better way to do this, and I just haven't found out yet :)
If you don't mind waiting up to ten seconds to see a message, I think that's the best way. If you want much faster responses, Comet seems to be a name for a different technique where a connection is left open and the server can send events whenever it wants - but that seems much more complex, especially on the server side when you want it to be scalable, and is probably best avoided until you have a clear understanding of how everything works. (The seemingly less hacky way is still being developed, and only Opera 9 has partial support for it so far). Unfortunately I have no idea where to find a good introduction to the whole AJAX area - hopefully someone else knows of useful resources [smile]

Share this post


Link to post
Share on other sites
Quote:
Original post by Eliia
It sounds like I can manipulate the page even after it is loaded using AJAX? Is that right? All I've seen is updating values in form fields... I'd like to update text, swap image names and make them show etc

It sounds like you are just using javascript and not AJAX. AJAX is a mix of DHTML, XML and server-side scripting. You can define an area of the page with a <DIV ID=""> tag, assigning it an ID so you can later set the content through javascript. Using ActiveX, you can connect to the server to retrieve XML data and format it with XSL or you can retrieve straight HTML. The page receives this as an httpRequest object and automatically calls an onLoad function (which you must set) when the request is completed.

Share this post


Link to post
Share on other sites
Quote:
Original post by Eliia
could someone please post something on DOM - I'm so used to just having a PHP page that can refresh, this is all so new to me :)

It sounds like I can manipulate the page even after it is loaded using AJAX? Is that right? All I've seen is updating values in form fields... I'd like to update text, swap image names and make them show etc


The HTML page you send represents a tree of nodes, with each tag corresponding to a node. That way of representing a document as a tree of nodes is called the Document Object Model (DOM), and you can change the nodes within the tree using the DOM functions in javascript. Often this just means looking up a given element, and altering one of its attributes or the text within it.

Share this post


Link to post
Share on other sites
Sign in to follow this  

  • Advertisement
×

Important Information

By using GameDev.net, you agree to our community Guidelines, Terms of Use, and Privacy Policy.

Participate in the game development conversation and more when you create an account on GameDev.net!

Sign me up!