[web] AJAX 101
Author
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
document.getElementById('some_element_id').innerHTML = the_HTML_to_replace_the_element_contents_with;
Don't use innerHTML. It's only supported by IE. You should use the DOM to create elements in the tree.
Author
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
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
Quote:Original post by SanderThat 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).)
Don't use innerHTML. It's only supported by IE.
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]
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.
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.
This topic is closed to new replies.
Advertisement
Popular Topics
Advertisement
