Ajax variable number of messages to page

[dcole.ath.cx]

I'm not the best a JavaScript. I'm trying to XML message from a PHP script that looks like <test timestamp=$ts><message1>hi</message1><message2>Hey</message2>...</test>. The message number is variable in quantity and given by var messagenumber.Can someone look through my code and tell me what's wrong. I think one of the errors in how I use final_value when defining the new final_value value.

var lastPing = 0;function updateMsgOnBrowser(testXML) {	var test = testXML.getElementsByTagName("test")[0];	var size = testXML.getElementsByTagName("size")[0];	var timestamp = test.getAttribute("timestamp");	if (timestamp > lastPing) {		lastPing = timestamp;		var size_value = size.firstChild.nodeValue;		for (i=0; i<=size_value; i++){			var messagename = "message" + i;			var message = testXML.getElementsByTagName(messagename)[0];			var message_value = message.firstChild.nodeValue;			if(i == 0){				var final_value = message_value;			}			else{				var final_value = final_value + "<br />" + message_value;			}		}		var msg_display = document.getElementById("msg_display");		msg_display.innerHTML = "<p>" +final_value + "</p>";	}}

If this doesn't look good, what would be a better way to get all the variables from a MySQL Databank and print them on a page, but keep updating it without reloading the page by using AJAX.

[Synook]

If this doesn't look good, what would be a better way to get all the variables from a MySQL Databank and print them on a page, but keep updating it without reloading the page by using AJAX.

What about using a PHP script to format the results into HTML and then just print the whole thing onto the page?

[dcole.ath.cx]

I tried that, but it only wants to take one line or some...

[Synook]

Uh? What PHP code do you have?

[justsomeguy]

If you've got a big object you want to move from PHP to Javascript I find it a lot easier to use JSON if you're not married to XML at this point. XML just seems to needlessly complicate everything. It's easy if you build an array in PHP and then just move the array directly to Javascript using JSON. So you can build your PHP array:

$retval = array(  'timestamp' => time(),  'messages' => array(	'message1',	'message2',	'message3'  ));

Then you need to include a file to do the JSON encoding, and just echo the encoded result for the AJAX response. This is the file to include:http://mike.teczno.com/JSON/JSON.phpsAnd you echo the JSON object like this:$json = new Services_JSON();echo $json->encode($retval);In Javascript you can get that value and use eval to rebuild it into a Javascript array/object, you don't need to include anything in Javascript (JSON is native to Javascript).

eval("var retval = " + xmlHttp.responseText);alert(retval.timestamp);for (var i = 0; i < retval.messages.length; i++){  alert(retval.messages[i]);}

[dcole.ath.cx]

Here is what my javascript looks like when it outputs a single line to the screen. My server.php has the JSON stuff on it now and is outputting the correct information, but I can't write the javascript code so it works correctly. Within updateMsgOnBrowser is the variable msg_display.innerHTML and this has to have the retval.messages in it, but I can't get it to function correctly. The following is the old javascript without the eval code:

function whichButton(event){	if(event.keyCode == 13){		talktoServer();	}}function talktoServer(){	var req = newXMLHttpRequest();	//register the callback handler function	  var callbackHandler = getReadyStateHandler(req, updateMsgOnBrowser);	  req.onreadystatechange = callbackHandler;	  req.open("POST", "server.php", true);	  req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");	  //get the value from the text input element and send it to server	  var testmsg = document.getElementById("testmsg");	  var msg_value = testmsg.value;	  req.send("msg="+msg_value);}// This is the callback functions that gets called// for the response from the server with the XML datavar lastPing = 0;function updateMsgOnBrowser(testXML) {	var test = testXML.getElementsByTagName("test")[0];	var message = testXML.getElementsByTagName("message")[0];	var ip = testXML.getElementsByTagName("ip")[0];	var timestamp = test.getAttribute("timestamp");	if (timestamp > lastPing) {		lastPing = timestamp;		var ip_value = ip.firstChild.nodeValue;		var message_value = message.firstChild.nodeValue;		var msg_display = document.getElementById("msg_display");		msg_display.innerHTML = " Server got the  message: \"" + 			message_value + "\"" +			"<br>Server IP: "+ ip_value + 			" Server Timestamp: \""+ timestamp + "\"";	}}//the following two functions are helper infrastructure to //craete a XMLHTTPRequest and register a listner callback functionfunction newXMLHttpRequest() {	var xmlreq = false;	if (window.XMLHttpRequest) {		xmlreq = new XMLHttpRequest();	} else if (window.ActiveXObject) {			// Try ActiveX		try { 			xmlreq = new ActiveXObject("Msxml2.XMLHTTP");		} catch (e1) { 			// first method failed 			try {				xmlreq = new ActiveXObject("Microsoft.XMLHTTP");			} catch (e2) {				 // both methods failed 			} 		} 	}   	return xmlreq;} function getReadyStateHandler(req, responseXmlHandler) {	return function () {	if (req.readyState == 4) {		if (req.status == 200) {				responseXmlHandler(req.responseXML);		} else {			var hellomsg = document.getElementById("hellomsg");			hellomsg.innerHTML = "ERROR: "+ req.status;			  }		} 	}}