How to load a Div with Dynamic Contents using AJAX?

[augustoamaral]

How to load a Div with Dynamic Contents using AJAX?I wanna call different dynamic contents to an specific Div.How can i do it ?

[jeffman]

There's a long answer if you're not 100% comfortable with AJAX yet, and a short answer if you are. Which one do you need?

[augustoamaral]

Both?Acctualy, the long. I'm not 100% confortable with AJAX...

[jeffman]

Here's a basic javascript engine, which is mostly what's going to be new for you.

<script type="text/javascript">         var hObj; //must be global         function hPostData(myData) { // form this data with &s and +s            hObj = null;            var myURL = "ajax_test.php";            if (hObj = getHObject()){               hObj.onreadystatechange = hStateChanged;               hObj.open ('POST', myURL, true); // true means "be asynchronous"               hObj.setRequestHeader("Content-Type", "text/plain;charset=UTF-8");               hObj.send (myData);            }else {alert ("Cannot get an HTTP object");}         }         function hStateChanged() {            if (hObj.readyState == 4) { // 4 means the data has arrived!!              if (hObj.status == 200) {                 printResponse(hObj.responseText); // responseText = data returned from your server              }else{                 alert ('Sorry: ' + hObj.status);              }           }         }         function getHObject() { // various options for Mozilla and @#$% IE            var hObj = null;            try {hObj = new XMLHttpRequest();}            catch (e) {               try {hObj = new ActiveXObject('Msxml2.XMLHTTP');}               catch (e) {hObj = new ActiveXObject('Microsoft.XMLHTTP');}            }            return hObj;         }         function printResponse(myText) { // This part is really up to you.            var myDIV = document.getElementById('myDiv');            myDIV.innerHTML = myText;         }</script>

You'll need a front end to collect data (like a form) and then pass it to hPostData() (other javascript functions).You'll also need a server script to receive data, process it, and send something back. Not much different than any script designed to receive POST data. (I just assumed POST, but it can also be GET.)innerHTML is the easiest way to put data into a div dynamically.Good luck!EDIT: I grabbed this from one of my older scripts, so it didn't have a setRequestHeader call when I posted it. I've never had a problem without one, but W3C encourages it, so I made that little addition, possibly while you've been reading over this.