"AJAX" pondering.

I'm writing a tech forum, well it's actually CRM which will handle 3 sites. anyway, trying to get on board with all this "AJAX" hype.

I noticed something very cool in this forum, when I hist "Post quick reply", it posts my text to server and gets a reply... so far so good. I know how to.

Now, funny thing happens, it gets the text and creates a new "reply" beneath the last reply on the bottom of screen without having to reload the whole page.

Anyone got an idéa how you can do that?

I have a guess that it perhaps have an empty DIV tag with a specific ID so it pushes the text|html into it ( innerHTML ) via javascript.

However, this can be done "unlimited" times, so if I were to have :

*reply*
*reply*
*reply*
<DIV ID="1"></DIV>

the above could work once. But as soon as I need to do another quick reply, there is no more "DIV-1" since I already filled it. I would need :

*reply*
*reply*
*reply*
<DIV ID="1"></DIV>
<DIV ID="2"></DIV>
.
.
.

hm... I hope this thread make any sense *lol* , hard to explain what I mean.

AJAX uses client side scripting, so if it's there you can see it in the page source. A quick look and I saw a reference to http://cboard.cprogramming.com/clien...post_loader.js which may be what you look for. Check it out.

Yepp, but I thought it would be more fun pondering about this and hear other people's idéas on how it could be done. I'll check out that source. Thanks.

Just found this :

http://www.dustindiaz.com/add-and-re...th-javascript/

Code:

---

function removeElement(divNum) {
  var d = document.getElementById('myDiv');
  var olddiv = document.getElementById(divNum);
  d.removeChild(olddiv);
}

---

Code:

---

function addElement() {
  var ni = document.getElementById('myDiv');
  var numi = document.getElementById('theValue');
  var num = (document.getElementById('theValue').value -1)+ 2;
  numi.value = num;
  var newdiv = document.createElement('div');
  var divIdName = 'my'+num+'Div';
  newdiv.setAttribute('id',divIdName);
  newdiv.innerHTML = 'Element Number '+num+' has been added!
 <a href=\'#\' onclick=\'removeElement('+divIdName+')\'>Remove the div "'+divIdName+'"</a>';
  ni.appendChild(newdiv);
}

---

Cool stuff!