cleary1981 Posted July 31, 2008 Share Posted July 31, 2008 I want to send some details to my database about a number of objects. Below is the code I have written but the problem I am having is that it only actually updates the details of the last object. Where am I going wrong? function render () { var yReturnValue = -5;var xReturnValue = -10; var arr = new Array(); arr = document.getElementsByTagName("div"); //make array of all divs with id = newObject // alert("Total Number of DIV Elements Found: " + document.documentElement.getElementsByTagName("div").length); for(var i=0; i < arr.length; i++) { //check innerHTML against obj_name result = document.documentElement.getElementsByTagName("div").item(i).innerHTML; yelementid=document.documentElement.getElementsByTagName("div").item(i); while( yelementid != null ){ yReturnValue += yelementid.offsetTop; yelementid = yelementid.offsetParent; } xelementid=document.documentElement.getElementsByTagName("div").item(i); while( xelementid != null ){ xReturnValue += xelementid.offsetLeft; xelementid = xelementid.offsetParent; } // alert("Name: " + result + " x: " + xReturnValue + " y: " + yReturnValue); } var url = "render.php?result=" + escape(result) + "&xReturnValue=" + escape(xReturnValue) + "&yReturnValue=" + escape(yReturnValue); url = url + "&dummy=" + new Date().getTime(); request.open("GET", url, true); request.send(null); } Quote Link to comment Share on other sites More sharing options...
rhodesa Posted July 31, 2008 Share Posted July 31, 2008 you need to move that final piece inside the loop: function render () { var yReturnValue = -5;var xReturnValue = -10; var arr = new Array(); arr = document.getElementsByTagName("div"); //make array of all divs with id = newObject // alert("Total Number of DIV Elements Found: " + document.documentElement.getElementsByTagName("div").length); for(var i=0; i < arr.length; i++) { //check innerHTML against obj_name result = document.documentElement.getElementsByTagName("div").item(i).innerHTML; yelementid=document.documentElement.getElementsByTagName("div").item(i); while( yelementid != null ){ yReturnValue += yelementid.offsetTop; yelementid = yelementid.offsetParent; } xelementid=document.documentElement.getElementsByTagName("div").item(i); while( xelementid != null ){ xReturnValue += xelementid.offsetLeft; xelementid = xelementid.offsetParent; } // alert("Name: " + result + " x: " + xReturnValue + " y: " + yReturnValue); var url = "render.php?result=" + escape(result) + "&xReturnValue=" + escape(xReturnValue) + "&yReturnValue=" + escape(yReturnValue); url = url + "&dummy=" + new Date().getTime(); request.open("GET", url, true); request.send(null); } } Quote Link to comment Share on other sites More sharing options...
cleary1981 Posted July 31, 2008 Author Share Posted July 31, 2008 Yeah I have tried that already and it didnt make any difference. Any other ideas? Quote Link to comment Share on other sites More sharing options...
rhodesa Posted July 31, 2008 Share Posted July 31, 2008 and if you uncomment that alert, it appears several times? Quote Link to comment Share on other sites More sharing options...
cleary1981 Posted July 31, 2008 Author Share Posted July 31, 2008 Ok! I have just noticed it is only the 1st object that will not update. The others do Quote Link to comment Share on other sites More sharing options...
cleary1981 Posted July 31, 2008 Author Share Posted July 31, 2008 ok. After more testing it seems that which objects get updated is completely random which makes me think that the system is busy when it loops through on some occasions. Does that sound possible? Quote Link to comment Share on other sites More sharing options...
KevinM1 Posted July 31, 2008 Share Posted July 31, 2008 You can shorten that code a bit, too: var xReturnValue = -10; var yReturnValue = -5; var arr = document.getElementsByTagName("div"); //you don't need to declare it as an empty array first for(var i = 0; i < arr.length; i++) { var result = arr[i].innerHTML; //you already have an array of all the <div> elements...why not use it? var elem = arr[i]; while(elem != null) //why use two loops when you can get the values all at once? { xReturnValue += elem.offsetLeft; yReturnValue += elem.offsetTop; elem = elem.offsetParent; } var timeString = "&dummy=" + new Date().getTime(); var url = "render.php?result=" + escape(result) + "&xReturnValue=" + escape(xReturnValue) + "&yReturnValue=" + escape(yReturnValue) + timeString; request.open("GET", url, true); request.send(null); } I made a modified version of it (without AJAX) that works in Firefox. Unfortunately, IE7 gives me an unknown runtime error. If you're interested, the script is here: http://www.nightslyr.com/arraytest.html Quote Link to comment Share on other sites More sharing options...
cleary1981 Posted July 31, 2008 Author Share Posted July 31, 2008 Thanks I was just looking at how I could shorten that code. Have you any ideas why all my objects are not updating. Is there a way I could make one write to the database instead of doing each one individually? Quote Link to comment Share on other sites More sharing options...
rhodesa Posted July 31, 2008 Share Posted July 31, 2008 it would be tough to get all that info into a GET request. if you use a JavaScript library (like jQuery), it allows you to build a JSON object with a bunch of data, and then pass it as POST data. that might be the better option... Quote Link to comment Share on other sites More sharing options...
cleary1981 Posted July 31, 2008 Author Share Posted July 31, 2008 Ive heard of it. Does that mean much reworking or can I use it just in this part? Quote Link to comment Share on other sites More sharing options...
rhodesa Posted July 31, 2008 Share Posted July 31, 2008 your JS and PHP will have to be changed Quote Link to comment Share on other sites More sharing options...
cleary1981 Posted July 31, 2008 Author Share Posted July 31, 2008 in just this function or my whole script? I dont want to have to change the whole thing if I can change this function and leave the rest that would be great. Wheres the best source for JSON material? Quote Link to comment Share on other sites More sharing options...
rhodesa Posted July 31, 2008 Share Posted July 31, 2008 with jquery, the javascript would look like: var arr = document.getElementsByTagName("div"); var data = { 'result[]' : [], 'xReturnValue[]': [], 'yReturnValue[]' : [] }; for(var i = 0; i < arr.length; i++) { var xReturnValue = -10; var yReturnValue = -5; for(var elem = arr[i];elem != null;elem = elem.offsetParent) { xReturnValue += elem.offsetLeft; yReturnValue += elem.offsetTop; } data['result[]'][] = arr[i].innerHTML; data['xReturnValue[]'][] = xReturnValue; data['yReturnValue[]'][] = yReturnValue ; } $.post("render.php",data); and on render.php: <?php foreach($_POST['result'] as $n=>$result){ $xReturnValue = $_POST['xReturnValue'][$n]; $yReturnValue = $_POST['yReturnValue'][$n]; //do what you want with the data } ?> Quote Link to comment Share on other sites More sharing options...
cleary1981 Posted August 1, 2008 Author Share Posted August 1, 2008 Thanks for that. I just implemented it there but I am getting a syntax error. Heres the code. I have included jquery-1.2.6.pack.js which i got from http://code.google.com/p/jqueryjs/downloads/detail?name=jquery-1.2.6.pack.js. Do you know where i am going wrong? Javascript with jquery script <script type="text/javascript" src="jquery.js"> </script> function render() { var arr = document.getElementsByTagName("div"); var data = { 'result[]' : [], 'xReturnValue[]': [], 'yReturnValue[]' : [] }; // ******************** Syntax error showing here ********************** for(var i = 0; i < arr.length; i++) { var xReturnValue = -10; var yReturnValue = -5; for(var elem = arr[i];elem != null;elem = elem.offsetParent) { xReturnValue += elem.offsetLeft; yReturnValue += elem.offsetTop; } data['result[]'][] = arr[i].innerHTML; data['xReturnValue[]'][] = xReturnValue; data['yReturnValue[]'][] = yReturnValue ; } $.post("render.php",data); } Quote Link to comment Share on other sites More sharing options...
rhodesa Posted August 1, 2008 Share Posted August 1, 2008 you need to put <script> tags around the block of JS too Quote Link to comment Share on other sites More sharing options...
cleary1981 Posted August 1, 2008 Author Share Posted August 1, 2008 yeah it is in javascript tags. I just cut and paste that function out of my code. Am I using jquery right? Quote Link to comment Share on other sites More sharing options...
rhodesa Posted August 1, 2008 Share Posted August 1, 2008 sorry....getting my PHP and JavaScript syntax mixed up...i tested this and it works: <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> function render() { var arr = document.getElementsByTagName("div"); var data = { 'result[]' : [], 'xReturnValue[]': [], 'yReturnValue[]' : [] }; for(var i = 0; i < arr.length; i++) { var xReturnValue = -10; var yReturnValue = -5; for(var elem = arr[i];elem != null;elem = elem.offsetParent) { xReturnValue += elem.offsetLeft; yReturnValue += elem.offsetTop; } data['result[]'].push(arr[i].innerHTML); data['xReturnValue[]'].push(xReturnValue); data['yReturnValue[]'].push(yReturnValue); } $.post("render.php",data); } </script> Quote Link to comment Share on other sites More sharing options...
cleary1981 Posted August 1, 2008 Author Share Posted August 1, 2008 Thanks. That solved that problem. Im now getting the following error when the script runs. '$' is undefined. Is there something missing in the last line of code? function render() { var arr = document.getElementsByTagName("div"); var data = { 'result[]' : [], 'xReturnValue[]': [], 'yReturnValue[]' : [] }; for(var i = 0; i < arr.length; i++) { var xReturnValue = -10; var yReturnValue = -5; for(var elem = arr[i];elem != null;elem = elem.offsetParent) { xReturnValue += elem.offsetLeft; yReturnValue += elem.offsetTop; } data['result[]'].push(arr[i].innerHTML); data['xReturnValue[]'].push(xReturnValue); data['yReturnValue[]'].push(yReturnValue); } $.post("render.php",data); } Quote Link to comment Share on other sites More sharing options...
rhodesa Posted August 1, 2008 Share Posted August 1, 2008 nope...that means jQuery.js isn't loading...are you sure you have the location of that correct? Quote Link to comment Share on other sites More sharing options...
cleary1981 Posted August 6, 2008 Author Share Posted August 6, 2008 yeah but somehow it got turned into a html file. Ive changed that and I dont get the error but the coordinates are still not updating. Any ideas? Quote Link to comment Share on other sites More sharing options...
cleary1981 Posted August 7, 2008 Author Share Posted August 7, 2008 Can anyone help me out I am still stuck? Quote Link to comment Share on other sites More sharing options...
cleary1981 Posted August 8, 2008 Author Share Posted August 8, 2008 [code]I think I have found the problem here but does anyone know how to solve it? Whatever is being passed to php as the value of the object_name is undefined. heres the javascript function render() { var arr = document.getElementsByTagName("div"); var data = { 'result[]' : [], 'xReturnValue[]': [], 'yReturnValue[]' : [] }; for(var i = 0; i < arr.length; i++) { var xReturnValue = -10; var yReturnValue = -5; for(var elem = arr;elem != null;elem = elem.offsetParent) { xReturnValue += elem.offsetLeft; yReturnValue += elem.offsetTop; } data['result[]'].push(arr.innerHTML); data['xReturnValue[]'].push(xReturnValue); data['yReturnValue[]'].push(yReturnValue); } $.post("render.php",data); }[/code] heres the php <?php require "config.php"; foreach($_POST['result'] as $n=>$result){ $xReturnValue = $_POST['xReturnValue'][$n]; $yReturnValue = $_POST['yReturnValue'][$n]; //do what you want with the data $q = mysql_query("update object set xpos='$xReturnValue', ypos='$yReturnValue' where object_name = '$result'"); } ?> I have added an alert in the code and found that .innerHTML is undefined. Quote Link to comment Share on other sites More sharing options...
KevinM1 Posted August 8, 2008 Share Posted August 8, 2008 Your code doesn't make sense. First, you set arr to an array of <div> elements. Then, in your second for-loop, you set elem to equal that entire array, which is wrong. You also attempt to use innerHTML on the entire array, which is also wrong. You need to remember to use the array index you're using in the loop. So, instead, you should have: . . . for(var elem = arr[i]; elem != null; elem = elem.offsetParent) { //stuff } . . . data['result[]'].push(arr[i].innerHTML); That should produce...something. At the very least, you should get some sort of output. Quote Link to comment Share on other sites More sharing options...
cleary1981 Posted August 11, 2008 Author Share Posted August 11, 2008 Yeah but the problem I was having was that not every record was getting read into mysql. I need a function that will read the whole block of records in. Can you suggest anything? Quote Link to comment Share on other sites More sharing options...
rhodesa Posted August 11, 2008 Share Posted August 11, 2008 let's step back to the HTML page. you have posted the javascript, but can you post the HTML that it is parsing? Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.