JavaScript - Trouble Accessing Variables Inside Of For Loop
I have the following code:
... var numberoffiles = array(); for (i = 1; $i <= totalNumberOfFiles; i++) { numberoffiles[i] = i; } ... I get an error saying that numberoffiles is undeclared or something What am I doing wrong? Do I need to declare it a global variable or something?? ALSO, why can't I do this: numberoffiles[] = i; I've seen code snippets that assign to the end of an array like this (Or maybe my problem is the scope of the variable??) Thanks OM Similar TutorialsI'm using a loop to get the attributes of a series of <a> tags in an xml. Here's the code: Code: function getAttributes(){ for(var i=0;i <= totalSteps;i++){ whichLink = xmlDoc.getElementsByTagName("xml")[0].getElementsByTagName("a")[i].attributes.getNamedItem("href").value.split("?"); alert(whichLink); if(whichLink[1]=="correctLink"){ alert("correctLink detected"); myMessage += whichLink[0]; } } displayMessage(); } When I run the function, I get a "Object required" error for the getElementsByTagName("a")[i] line, and displayMessage() won't fire. The weird thing is, the alert(whichLink); and alert("correctLink detected"); commands both work correctly, and when I replace the i variable with a digit, like 1 , everything works smoothly (save for the fact that it only returns one of the urls I'm looking for). So something odd is going on with my loop variable, but I'm at a loss as to what. Anyone have any ideas? Appreciated as always, ~gyz Hey is it possible to access javascript variables in an iframe src page from the parent page, or vice versa. How do you do this? What about the DOM? thanks All, I have the following code: Code: var http_request = false; function makePOSTRequest(url, parameters) { alert(parameters); http_request = false; if (window.XMLHttpRequest) { // Mozilla, Safari,... http_request = new XMLHttpRequest(); if (http_request.overrideMimeType) { // set type accordingly to anticipated content type //http_request.overrideMimeType('text/xml'); http_request.overrideMimeType('text/html'); } } else if (window.ActiveXObject) { // IE try { http_request = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { http_request = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) {} } } if (!http_request) { alert('Cannot create XMLHTTP instance'); return false; } http_request.onreadystatechange = alertContents; http_request.open('POST', url, true); http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); http_request.setRequestHeader("Content-length", parameters.length); http_request.setRequestHeader("Connection", "close"); http_request.send(parameters); } function alertContents() { if (http_request.readyState == 4) { if (http_request.status == 200) { result = http_request.responseText; document.getElementById('myspan').innerHTML = result; } else { alert('There was a problem with the request.'); } } } function getjob(obj) { var poststr = "job_id=" + encodeURI( obj ); makePOSTRequest('getnextjob.php', poststr); } I call the getjob but doing the following: echo "<li><a href=\"#\" onclick=\"javascript:getjob($resultsetjob[job_id]); return false;\">$resultsetjob[name]</a></li>"; It's weird, only sometimes does it pass the variable and other times it doesn't. Is there a better way to do this?? Thanks in advance. Hi This part of the script should ask the user which type of shape they'd like to calculate the area of, then convert whatever they enter to uppercase so that the test condition can be eventually falsified when the user enters 'c, C, s, S, r or R'. I've consulted the w3 school, and as far as I can tell I'm formatting it correctly. I think the problem may be in the syntax of the test condition. Code: while (shapeType != 'C' || shapeType != 'S' || shapeType != 'R') { shapeType = prompt("Which type of Shape would you like to find the area of?" + '\n' + "For a circle, enter C" + '\n' + "For a square, enter S" + '\n' + " For a rectangle, enter R"); shapeType = shapeType.toUpperCase(); } However, firebug reports that 'shapeType is null'. How can this be? I've declared shapeType in the head as a global variable. Any ideas? Jenny All I am trying to pull the data from an array and place it in a table. If I assign index 0 it works as desired. I then placed it inside a foor loop and changed the index to a variable and I get "undefined". Here is the code snipet: document.write("<table width='500'>"); document.write("<tr><td width='75%'>Product:</td><td width='25%' align='center'>Cost</td></tr>"); for (i=0; i<(itemPrice.length); i++); { document.write("<tr><td>" + itemName[i] + "</td><td align='right'>" + itemPrice[i] + "</td></tr>"); totalcost = totalcost + itemPrice[i]; } document.write("<tr><td>The total is:</td><td align='right'>" +"$ "+totalcost+ "</td></tr>"); document.write("</table>"); compared to some of the samples I have seen I apologize if this is too elementary. rneaul This is the loop I'm trying to use to check for bullets hitting rocks. the function worked if I used actual numbers instead of the j variable, but I wanted to loop through all the rocks. Can anyone see why the inner function loses the j index and says asteroids[j] is undefined? the hit test is removing the bullets! it's working! the asteroids[j] was used in the hit test! I'm getting testy. LOL Code: for(z in player.bullets){ for(j in asteroids){ if( pnpoly( asteroids[j].points_x, asteroids[j].points_y, player.bullets[z].x - asteroids[j].x, player.bullets[z].y-asteroids[j].y)==true) { player.bullets.shift(); asteroids[j].hits++; for(i in asteroids[j].points_x){ asteroids[j].points_x[i]*=.5; asteroids[j].points_y[i]*=.5; } }; } Here's the whole script. This is the asteroids script somebody needed help with a few days ago. I just couldn't resist making this. I love asteroids so much it's hard to describe. That game was simply the most awesome thing ever at the time. (I'm a product of the eighties) Code: <html> <head> <title></title> <script type="text/javascript" src="excanvas.js"></script> </head> <body> <script> function pnpoly(xp, yp, x, y){var c=0;for(i in xp){ j=i++;if((((yp[i]<=y)&&(y<yp[j]))||((yp[j]<=y)&&(y<yp[i])))&&(x<(xp[j]-xp[i])*(y-yp[i])/(yp[j]-yp[i])+xp[i])){c =!c}} return c} var canvas = null; var c2d = null; //... window.onload = init; function init() { thrustFlame=false asteroids = [{ x: 470, y: 290, angle: 1.71, inertia: .5, inertiaAngle: 1.2, points_x: [-30, -27, 5, 15, 30, 15,-5], points_y: [ -5, 15, 30, 27, -5, -25, -30], hits:0 }, { x: 270, y: 290, angle: 1.71, inertia: .75, inertiaAngle: 1.9, points_x: [-30, -10, 0, 20, 40, 20, -10], points_y: [0, -20, -50, -30, 0, 20, 20], hits:0 }] player = { x: 50, y: 50, angle: 1.71, inertia: 0, inertiaAngle: 0, bullets:[] } canvas = document.getElementById('canvas'); ctx = canvas.getContext('2d'); setInterval(step, 60); } function step() { for (i in asteroids) { asteroids[i].angle += i % 2 == 0 ? .05 : -.05 asteroids[i].x < 0 ? asteroids[i].x = canvas.width : asteroids[i].x %= canvas.width asteroids[i].y < 0 ? asteroids[i].y = canvas.height : asteroids[i].y %= canvas.height asteroids[i].x += Math.sin(asteroids[i].inertiaAngle) * asteroids[i].inertia; asteroids[i].y += -Math.cos(asteroids[i].inertiaAngle) * asteroids[i].inertia } ctx.fillStyle = "rgb(0,0,0)" ctx.fillRect(0, 0, canvas.width, canvas.height); for (u = 0; u < asteroids.length; u++) { ctx.save(); ctx.beginPath() Asteroid_draw(asteroids[u]); ctx.closePath(); ctx.strokeStyle = "#eeeeff"; ctx.stroke(); ctx.restore(); } ctx.save(); ctx.beginPath() Player_draw(player); ctx.closePath() ctx.strokeStyle = "#eeeeff"; ctx.stroke(); ctx.restore() if(thrustFlame){ ctx.save(); ctx.beginPath() Player_drawFlame(player); ctx.closePath() ctx.strokeStyle = "#ff0000"; ctx.stroke(); ctx.restore() thrustFlame=false } player.x < 0 ? player.x = canvas.width : player.x %= canvas.width player.y < 0 ? player.y = canvas.height : player.y %= canvas.height if (player.inertia > .025) player.inertia -= .025 player.x += Math.sin(player.inertiaAngle) * player.inertia; player.y += -Math.cos(player.inertiaAngle) * player.inertia for(i in player.bullets){ player.bullets[i].timer++; if(player.bullets[i].timer > player.bullets[i].range)player.bullets.shift() player.bullets[i].x < 0 ? player.bullets[i].x = canvas.width : player.bullets[i].x %= canvas.width player.bullets[i].y < 0 ? player.bullets[i].y = canvas.height : player.bullets[i].y %= canvas.height player.bullets[i].x += Math.sin(player.bullets[i].inertiaAngle) * player.bullets[i].inertia; player.bullets[i].y += -Math.cos(player.bullets[i].inertiaAngle) * player.bullets[i].inertia ctx.save(); ctx.beginPath() ctx.fillStyle="rgba(255,255,0,1)" ctx.arc(player.bullets[i].x,player.bullets[i].y,1.5,0,3.14,true) ctx.fill() ctx.closePath() ctx.restore(); } for(z in player.bullets){ for(j in asteroids){ if( pnpoly( asteroids[j].points_x, asteroids[j].points_y, player.bullets[z].x - asteroids[j].x, player.bullets[z].y-asteroids[j].y)==true) { player.bullets.shift(); asteroids[j].hits++; for(i in asteroids[j].points_x){ asteroids[j].points_x[i]*=.5; asteroids[j].points_y[i]*=.5; } }; } } } function Asteroid_draw(obj) { ctx.translate(obj.x, obj.y) ctx.rotate(obj.angle); ctx.moveTo(obj.points_x[0], obj.points_y[0]); for (i = 0; i < obj.points_x.length - 1; i++) { ctx.lineTo(obj.points_x[i], obj.points_y[i]); } ctx.lineTo(obj.points_x[0], obj.points_y[0]) } function Player_draw(obj) { ctx.translate(obj.x, obj.y); ctx.rotate(obj.angle); //Points {0,-12}{7,5}{-7,5} ctx.moveTo(0, -12); ctx.lineTo(7, 4); ctx.lineTo(-7, 4); ctx.moveTo(-7, 4) ctx.lineTo(0, -12); } function Player_drawFlame(obj) { ctx.translate(obj.x, obj.y); ctx.rotate(obj.angle); ctx.moveTo(-2, 2); ctx.lineTo(0, 12); ctx.lineTo(2, 2); } document.onkeydown = function (event) { keyDown(event) }; function keyDown(event) {event=!event?window.event:event if (event.keyCode == 32) { player.bullets.push({x:player.x,y:player.y,inertia:player.inertia+10,inertiaAngle:player.angle,timer:0,range:40}) } if (event.keyCode == 37) { player.angle -= .1 } /*left*/ else if (event.keyCode == 39) { player.angle += .1 } /*right*/ else if (event.keyCode == 38) { thrustFlame=true var x1= Math.cos(player.inertiaAngle)* player.inertia; var y1= Math.sin(player.inertiaAngle)* player.inertia; var x2= Math.cos(player.angle)* .2; var y2= Math.sin(player.angle)* .2; var xR= x1 + x2; var yR= y1 + y2; var lengthR= Math.sqrt(xR*xR+yR*yR); if (lengthR==0){angleR=0} var angleR= Math.acos(xR/lengthR); if (yR<0)angleR= 0-angleR; player.inertia=lengthR // player.inertiaAngle = (player.inertiaAngle*19 + player.angle) / 20 player.inertiaAngle =angleR } /* up*/ else if (event.keyCode == 40) { player = { x: 50, y: 50, angle: 1.71, inertia: 0, inertiaAngle: 0 } } /*down*/ } </script> <canvas id="canvas" width="600" height="600"></canvas> </body> </html> I'm just a beginner with JS and having trouble with the code for my array and FOR loop. I'd like the names of these animals to be listed on separate lines. Am I way off here? I wasn't sure if the for statement had to be within a function. I've spent hours trying to figure this out and appreciate any help. <script type="text/javascript"> var animal = new Array(4); animal[0] = "dog"; animal[1] = "cat"; animal[2] = "bird"; animal[3] = "rabbit"; var counter = 0; function writeAnimal () { for (var counter = 0; counter== 4; counter++) { document.write(animal[0]); document.write("<br />"); } } </script> Forgive but I'm quite a beginner at JS . . . Anyway, on my website I've got a form, and then a script that validates the form. The script for validation is inside a function. The problem is that I have another script outside of the function that generates random numbers to make sure there's not a spambot submitting the form. I set a variable called 'answer' as the correct answer, but for some reason, the variable won't be read when I put it inside the original function to make sure the user got it right. How should I go about doing this? Thanks, Raybob Code: <!-- THIS SCRIPT ENSURES FIELDS ARE FILLED OUT CORRECTLY --> <script type="text/javascript"> var x1 = Math.floor(Math.random()*11); var x2 = Math.floor(Math.random()*11); var ans = x1+x2; </script> <script type="text/javascript"> <!-- function validate_form ( ) { var valid = true; var at = document.newaccount.email.value.indexOf ("@"); var dot = document.newaccount.email.value.lastIndexOf ("."); if ( document.newaccount.name.value == "" ) { document.getElementById('noname').style.display = 'inline'; valid = false; } if ( at < 2 || dot < at+2 || dot+2 >= document.newaccount.email.value.length ) { document.getElementById('wrongemail').style.display = 'inline'; valid = false; } if ( document.newaccount.password.value == "" ) { document.getElementById('nopassword').style.display = 'inline'; valid = false; } if ( ( document.newaccount.password2.value == "" ) && ( document.newaccount.password.value !== "" ) ) { document.getElementById('nopassword2').style.display = 'inline'; valid = false; } if ( ( document.newaccount.password.value !== document.newaccount.password2.value ) && ( document.newaccount.password.value !== "" ) && ( document.newaccount.password2.value !== "" ) ) { document.getElementById('nomatch').style.display = 'inline'; valid = false; } if ( ( document.newaccount.password.value.length < 8 ) && ( document.newaccount.password.value !== "" ) ) { document.getElementById('passwordlength').style.display = 'inline'; valid = false; } if ( ( document.newaccount.agree[0].checked == false ) && ( document.newaccount.agree[1].checked == false ) ) { document.getElementById('noagree1').style.display = 'inline'; valid = false; } if ( ( document.newaccount.agree[0].checked == false ) && ( document.newaccount.agree[1].checked == true ) ) { alert ( "Sorry, but you must agree to the terms and conditions before creating an account." ); valid = false; window.location = "/terms.html" } if ( document.newaccount.spamcheck.value == "" ) { document.getElementById('nomath1').style.display = 'inline'; valid = false; } if ( ( document.newaccount.spamcheck.value !== ans ) && ( document.newaccount.spamcheck.value !== "" ) ) { document.getElementById('nomath2').style.display = 'inline'; valid = false; } if ( (!document.newaccount.store.checked) && (!document.newaccount.share1.checked) && (!document.newaccount.share2.checked) ) { document.getElementById('noinfo').style.display = 'inline'; valid = false; } return valid; } //--> </script> <!-- END OF SCRIPT --> Code: <form name="newaccount" onsubmit="return validate_form ( );" action="/submitted.html" method="get" > <center> <table style="text-align:center;" ><tr><td> What's <script type="text/javascript"> document.write (x1 + " " + "+" + " " + x2); </script> ? <input type="text" size="5" name="spamcheck" /></td></tr></table> <br /> <br /><br /> <input type="submit" name="send" value="Submit" /> </center> </form> Hi! I'm new to this forum and almost completely new to programming of any kind, so this may be a very easy, obvious fix; I'm just not sure. Below is a very simple script I wrote partially based on random example scripts. I think an error is generated when the while loop is first executed, because any code I place after the loop is not executed. My guess is that when null is returned, it crashes and stops executing the code. Is that the problem? If so, do you have any ideas for how I could fix it? Thanks in advance for your help! HTML: Code: <a href="javascript:expand(document.getElementById('exp1'))">SeeText</a> <div id="exp1" style="display:none"> <p>SomeText</p> </div> <a href="javascript:expand(document.getElementById('exp2'))">SeeText</a> <div id="exp2" style="display:none"> <p>SomeText</p> </div> Javascript: Code: function expand(param) { i=0; id="exp1"; if (param.style.display=="none") { while (getElementByID(id)) //This seems to be the trouble area. { document.getElementById(id).style.display="none"; i++; id="exp"+String(i) } } param.style.display=(param.style.display=="none")?"":"none"; } Hi, I have this loop: Code: for (var j = 0; j < gmarkers.length; j++) { gmarkers[j].hide(); elabels[j].hide(); map.closeInfoWindow(); var str=gmarkers[j].myname.toLowerCase(); var patt1=inp; if (str.match(patt1)) { found = true; gmarkers[j].show(); count++; var p=j; } } which was useful for passing the p variable when it was just one number. but now I need to get that number every time j gets set (I understand that the j gets overwritten each time the loop goes through). What would be ideal is if p could become an array, the contents of which match the values that j has passed though during the loop cycle. I thought var p = new Array (j); minght do the trick, but obviously not... I hope that I'm explaining it OK, and that it's possible, and that somebody has an idea how to do it... Hi... I just want to know if it is possible to have an autocalculate in a textboxes inside while loop?and if it is possible how?.. here is my code: Code: <html> <head> <style type="text/css"> #fieldset_PS{ position: relative; width: 20%; } </style> <link rel="stylesheet" type="text/css" href="kanban.css" /> <script type="text/javascript"> function display_PS(){ document.loading_kanban.action="ParameterSettings.php"; document.loading_kanban.submit(); } function display_Kanban(){ document.loading_kanban.action="kanban_report.php"; document.loading_kanban.submit(); } </script> </head> <?php error_reporting(0); $con = mysql_connect('localhost', 'root',''); if (!$con) { echo 'failed'; die(); } mysql_select_db("mes", $con); ?> <form name="loading_kanban"> <div id="main_button"> <center> <!--<label style="margin-left: .9em; font-family: Arial, Helvetica, sans-serif; font-size: .7em;">Display Details:</label><input onclick='showDetails(this);' id='chkDetail' type='checkbox' checked='checked' value='wip'/> --> <input type="button" name="parameter_settings" value="Parameter Settings" onclick="display_PS()"> <input type="button" name="parameter_settings" value="Stock Requisition"> <input type="button" name="parameter_settings" value="Kanban Report" onclick="display_Kanban()"> </div> <div id="fieldset_PS"> <fieldset> <legend>Parameter Settings</legend> </center> <table border="1"> <th>Compounds</th> <th>Max</th> <th>Min</th> <?php $sql = "SELECT PCODE FROM parameter_settings ORDER BY PCODE ASC"; $result = mysql_query($sql, $con); while ($row = mysql_fetch_assoc($result)){ echo "<tr> <td>$row[PCODE]</td> <td><input type = 'text' name = 'max_pcode' size = '10'></td> <td><input type = 'text' name = 'min_pcode' size = '10'></td> </tr>"; } ?> </fieldset> </table> </div> </form> </html> I have table : parameter settings and i have fields: PCODE, max, min PCODE has data: PXX PYY PZZ PAA PBB Total I just want to know how can I auto calculate the total max and total min and it will display in the textbox beside Total... Thank you I am trying to create a simple auto-calculate function for a webpage. What should be happening: The 'onchange' command should pass the 'price' of the item to the function, the function should then cycle through all the dropdowns (or checkboxes or fields) and calculate the total. What is happening: It is only picking up the last checkbox. It seems that the 'for' loop only remembers the last item in the array. What am I doing wrong? How can I get the code to remember all the items? thanks, Code: <script language="JavaScript" type="text/javascript"> function calculateTotal(price) { var total = 0; var cList = ['sel1','sel2','sel3']; for (i=0;i<2;i++); var select = GetE(cList[i]); total+= price * (select.options[select.selectedIndex].value); GetE("totalShow").innerHTML = total.toFixed(2); } function GetE(id) {return document.getElementById(id); } </script> <html> <head></head><body> <form id="form1" name="form1" method="post" action=""> <select name="sel1" id="sel1" onchange="calculateTotal(100)"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select><br><br> <select name="sel2" id="sel2" onchange="calculateTotal(200)"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select><br><br> <select name="sel3" id="sel3" onchange="calculateTotal(300)"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select><br><br> </form> <br>total <span id="totalShow">0.00</span> </body></html> hi i'd like to ask how can i ask for a function inside a for loop , if i remove the loop the code works fine but i need it for 10 rows . please help , here is the code PHP Code: $content .=' <table cellspacing="2" cellpadding="2" border="0" align="center" > <SCRIPT LANGUAGE="JavaScript" type="text/JavaScript"> function doCalcAndSubmit() { // get both values kolicina1 = document.forms["vlez1"].kolicina.value; cena1 = document.forms["vlez1"].cena.value; // do some calculation vkupno1 = kolicina1 * cena1; // set the value in the right field document.forms["vlez1"].vkupno.value = vkupno1; } </script> <form id="vlez1" name="vlez1" method="POST" action="index_execute.php" > <tr valign="middle"> <td></td> <td align="center"><b> Sifra : </b></td> <td align="center"><b> Kolicina : </b></td> <td align="center"><b> Cena : </b></td> <td align="center"><b> Vkupno : </b></td> </tr> '; for($t=1;$t<11;$t++) { $content .= ' <tr valign="middle"> <td>'.$t.'.</td> <td><input type="text" id="sifra" autocomplete="off" name="sifra['.$t.']" align="middle" onblur="normalField(this);" onfocus="fireKeyListener_sifra(event); highlightField(this,1);" onkeyup="getList_sifra(event);" size="25" value="" /></td> <td><input type="text" id="kolicina" name="kolicina['.$t.']" align="middle" size="25" ></td> <td><input type="text" id="cena" name="cena['.$t.']" align="middle" size="25" onblur="doCalcAndSubmit();"></td> <td><input type="text" id="vkupno" disabled name="vkupno['.$t.']" align="middle" size="25" ></td> <input type="hidden" name="hidden_data" value="'.$data.'"> </tr>'; } $content .= '<tr> <td></td> <td></td> <td align="center"><input type="submit" id="submit2" name="submit2" value="Potvrdi" ></td> </tr> </form> </table> '; Hi, I hope someone can help me figure this out - it's been bugging me for a whole day now, and I can't seem to figure it out, and so far no Google research found this exact problem for me... Situation: I have a simple HTML page with one DIV element with the id "rotator". Inside that, JavaScript is supposed to create boxes that react to mouseovers. The weird thing is: The whole script works, but ONLY on the LAST box I create, no matter what I do. I can manually add the mouseover code to any one of these boxes, but it will only take on the last one. I can have JavaScript tell me the mouseover status of each box, and they all tell me they have code assigned correctly - but again only the last one works... Here's the relevant code (yes, highly abbreviated, but it's the part that fails on me): Code: var maxBoxes = 10; function initSite() { var rotator = document.getElementById("rotator"); rotator.innerHTML = ""; for (x = 0; x < maxBoxes; x++) { rotator.innerHTML +='<div id="myBox' + x + '"></div><div id="myDark' + x + '"></div>'; // various other stuff about myBoxes[x] also in here, but not relevant to the issue I think applyMouseActions(document.getElementById("myDark" + x); debugOutput(document.getElementById("myDark" + x).id+"=" + document.getElementById("myDark" + x).onmouseover + "<br>", 1); } } function applyMouseActions(item) { if (!item) return; item.onmouseover = function(ev) { alert("does this work?"); var thisNum = this.id; thisNum = thisNum.charAt(this.id.length-1); var tempBox = myBoxes[thisNum].boxOb; tempBox.style.background = "#fff"; } item.onmouseout = function(ev) { var thisNum = this.id; thisNum = thisNum.charAt(thisNum.length-1); var tempBox = myBoxes[thisNum].boxOb; tempBox.style.background = "#aaa"; } } initSite is called in the body onload. All kinds of other animation parts are implemented that work fine, just this mouseover won't work. I have tried re-writing it in multiple different ways, including "xyz.onmouseover = myMouseCode" and then defining the function separately later - still no dice. So, the code creates 10 boxes (0-9) and 10 boxes that are on top of them to create a form of shadow effect depending on the position of the original boxes. Since the "myDark" boxes are on top of the "myBox" boxes, I apply the onmouseover onto the "myDark" boxes, but it only works on "myDark9" and no other box. They are all created the same way, the mouseover assigned the same way... All I can do is shake my head at it, but that doesn't fix the issue, obviously ;-) Any idea what else I can try? Thanks! Hey, I'm attempting to add functuallity to some code and have been having problems getting loops to create variables that are usable. I know the actual programming seems rather redundant as im creating a variable for each div then looping it to create each div, but it is the only way i can get it to work with other parts of the website. So the actual code takes the variables defining the content of each div and uses the loop to actually produce the divs. I am having problems with the + "linkdiv" + x + part of the actual loop. however way i try to define the variable it simply prints the "linkdiv1" or "linkdiv2" ect... rather then referencing the earlier variable that was created and printing "div1". is this even possible in javascript? The whole whing works when i reference a variable directly, just not when i try to use a loop to create the reference for me. If i use a variable directly i get 5 of the same references rather than one of each reference which is not what i want. please note thati define the colour1 and colour2 variables along with the rest of the actual code earlier in the function... Code: var linkdiv1="<p style=\"color:"+ colour1+"\">div1</p>" var linkdiv2="<p style=\"color:"+ colour1+"\">div2</p>" var linkdiv3="<p style=\"color:"+ colour1+"\">div3</p>" var linkdiv4="<p style=\"color:"+ colour1+"\">div4</p>" var linkdiv5="<p style=\"color:"+ colour1+"\">div5</p>" <!-----------------------------------------------------------------> for (x = 1; x <= 5; x++) { document.write("<div style=\""+colour1+"\" id=\"div"+x+"\">" + "linkdiv" + x + "</div>") } feel free to ask for more infomation or more code as im not even sure if this makes enough sense to answer the question. Having troubles writing this in a way thats easily understood as i had to take a lot of code that wasnt relevent out. thanks... Below is the code. My function: Code: function swap_content(id1,id2) { var tmp = document.getElementById(id1).name; var theval = document.getElementsByName('primary_propertyp_id')[0].value; document.getElementById(id1).name = document.getElementsByName('primary_propertyp_id')[0].name; document.getElementsByName('primary_propertyp_id')[0].name = tmp; document.getElementById(id2).id = document.getElementById('primary').id; document.getElementById('primary').id = 'addressid_'+theval+'_div'; } Applicable Code for primary info: Code: <div id="primary"> <label>primary to secondary:</label><input name="primary_propertyp_id" type="text" id="addressid_<? echo $row['primary_property_id']; ?>" value="<? echo $row['primary_property_id']; ?>"/> </div> Applicable Code for secondary info/link to change: Code: echo "<div id=\"addressid_" . $properties_row['id'] . "_div\">"; echo "<a href=\"#\" onclick=\"swap_content('addressid_" . $properties_row['id'] . "','addressid_" . $properties_row['id'] . "_div'); return false\">Make Primary</a>"; echo "<input id=\"addressid_" . $properties_row['id'] . "\" name=\"addressids[]\" value=\"" . $properties_row['id'] . "\" type=\"text\">"; echo "</div>"; This is running through a PHP loop so it's making multiple divs and links for the secondaries. I am wanting to be able to swap out any of them to make them 'primary'....this works for the first click, but after the first click it makes every div id and input name the same as the first that was clicked. It's also not working AT all if i click on the bottom link first, then a link above it. Top-down works, bottom-up doesn't...Please help Thanks in advance, Jeremy Hello, I have a multi-dimensional object, derived from JSON returned by the Foursquare API. The object has the following structure (as printed using a print_r type method from http://www.openjs.com/scripts/others...hp_print_r.php PHP Code: '0' 'id' => "27110xxx" 'created' => "Sun, 11 Apr 10 15:09:45 +0000" 'timezone' => "America/New_York" 'user' ... 'id' => "48xxx" 'firstname' => "Barry" 'lastname' => "xxx" 'photo' => "http://playfoursquare.s3.amazonaws.com/userpix_thumbs/4abb5bxxxxxx.jpg" 'gender' => "male" 'display' => "xxxx. @ [off the grid]" '1' ... 'id' => "2538xxxx" 'created' => "Wed, 07 Apr 10 13:24:41 +0000" 'timezone' => "Europe/London" Could anyone tell me the best way to access its elements? I have this so far which gets the required values, but I want to preserve the order ie. get the data from the first element in the object first, then move to the next - each element represents a user so I want to keep their data separate. PHP Code: /* This is a custom function which has the same function as print_r */ function dump(arr,level) { var firstName, lastname, geolat, geolong, photo; var dumped_text = ""; if(!level) level = 0; //The padding given at the beginning of the line. var level_padding = " "; for(var j = 0; j < level + 1; j++) level_padding += " "; if(typeof(arr) == 'object') { //Array/Hashes/Objects for(var item in arr) { var value = arr[item]; if(typeof(value) == 'object') { //If it is an array, dumped_text += level_padding + "'" + item + "'\n"; dumped_text += dump(value,level + 1); } else { dumped_text += level_padding + "'" + item + "' => \"" + value + "\"\n"; } if (item == 'firstname') { firstname = value; document.write("First name: " + firstname + "<br />"); document.write(item); } if (item == 'lastname') { lastname = value; document.write("Last name: " + lastname + "<br />"); document.write(item); } if (item == 'geolat') { geolat = value; document.write("Latitude: " + geolat + "<br />"); document.write(item); } if (item == 'geolong') { geolong = value; document.write("Longitude: " + geolong + "<br />"); document.write(item); } } } else { //Stings/Chars/Numbers etc. dumped_text = "===>"+arr+"<===("+typeof(arr)+")"; } return dumped_text; } var myObj = <?php echo json_encode($checkin); ?>; alert(dump(myObj)); Sorry for the bloated code, I normally work in Java and PHP so although I understand the theory, I haven't worked with objects much in JavaScript before. Any help would be much appreciated! hy all, I am creating an accordion menu that when i press the " UNIT " tab, it opens up a list of " Chapters " tab, and when i press on any one of those chapters, a list of lessons opens up. Till now, i have managed to create all the appropriate lists, but in default, lessons and chapters are opened automatically, and the lessons elements when pressed do not scroll back up to the chapters parents. My html5 file: Code: <script type="text/javascript" src="jqueryjs.js"></script> <script type="text/javascript" src="jqueryuiaccor.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#accordion').accordion(); }); </script> <div id="container"> <div id="content"> <div id="sidebar"> <ul id="accordion"> <li> <a href="#recent" class="heading">Unit 1</a> <ul id="accordion"> <li> <a href="#recent" class="heading">Chapter 1 </a> </li> <ul id="accordion2"> <li> Lesson 1 </li> </ul> </ul> </li> <li> <a href="#recent" class="heading">Unit 2</a> <ul id="accordion"> <li> <a href="#recent" class="heading">Chapter 1 </a> </li> <ul id="accordion"> <li> <a href="#recent" class="heading" role="tab" aria-expanded="true">Chapter 2 </a> <ul id="accordion"> <li> <a href="#recent" class="heading">Lesson 1 </a></li> </ul> </li> </ul> </ul> </li> </ul> </div> </div> </div> My acorjs.js file: Code: $(document).ready(function() { $('ul#accordion a.heading').click(function() { $(this).css('outline','none'); if($(this).parent().hasClass('current')) { $(this).siblings('ul').slideUp('slow',function() { $(this).parent().removeClass('current'); $.scrollTo('#accordion',1000); }); } else { $('ul#accordion li.current ul').slideUp('slow',function() { $(this).parent().removeClass('current'); }); $(this).siblings('ul').slideToggle('slow',function() { $(this).parent().toggleClass('current'); }); $.scrollTo('#accordion',1000); } return false; }); }); Please HELP! i m trying to extract data from an xml file and display data on Google maps but when i try to run my code In IE - Access denied error is display (while accessing the xml file) Mozilla - code is working fine but displays following error - Error: xmlDoc.getElementsByTagName("lat")[1] is undefined Source File: file:///I:/BE%20Project%20Data/coding/Myexample/exam2.html Line: 48 HTML file- <html> <head> <title>Google Maps JavaScript API v3 Example: Fusion Tables Layer</title> <link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" /> <style type="text/css"> html { height: 100% } body { height: 100%; margin: 0px; padding: 0px } #map_canvas { height: 500px;width: 800px } </style> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> <script type="text/javascript"> function initialize() { if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.open("GET","agridata.xml",false); xmlhttp.send(); xmlDoc=xmlhttp.responseXML; var latlng = new google.maps.LatLng(48.75028,-94.91667); var mapOpts = { zoom: 5, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP, }; var map = new google.maps.Map(document.getElementById("map_canvas"),mapOpts); var l1=xmlDoc.getElementsByTagName("lat")[1].childNodes[0].nodeValue; var l2=xmlDoc.getElementsByTagName("lng")[1].childNodes[0].nodeValue; var pt = new google.maps.LatLng(parseFloat(l1), parseFloat(l2)); var marker = new google.maps.Marker({ position: pt, map: map, title: 'Just a simple marker'}); } </script> </head> <body onload="initialize();"> <h1>output</h1> <div id="map_canvas"></div> </body> </html> XML file - <?xml version="1.0"?> <markers> <marker> <lat>52.09667</lat> <lng>-173.50056</lng> <state>Alaska</state> <county>Aleutian</county> </marker> <marker> <lat>48.75028</lat> <lng>-94.91667</lng> <state>Minnesota</state> <county>Lake of woods</county> </marker> <marker> <lat>52.09667</lat> <lng>-173.50056</lng> <state>Washington</state> <county>Stevans</county> </marker> </markers> do let me know the reason behind the undefined error and ACCESS DENIED error ... i have tried modification in the security setting of the browser but error is not solved yet ... thks Hello, I have a simple form with simple validation. I am just playing around a bit with forms and don't really have concrete knowledge. What I have done is created a form. Asking for first name, last name, age and email. When the user clicks the submit button I want 2 functions to run, the first checking the input is correct and also making sure all fields have a value. Once everything is checked and is O.K I want to go into another function which sends all this information to an array one by one. I am having difficulty accessing each individual input tag. I could achieve what I want to do, but it will take double the lines of code because each input has a different 'name'. So, what I am trying to do is access the input tags the same as you would do an array. Here is my code: HTML: Code: <form name="regForm" id="form"> <fieldset> <legend>Real Heroes - Registration Form</legend> <p>First Name:<input type="text" size="30" maxlength="20" name="txtFirstName" /></p> <p>Last Name:<input type="text" size="30" maxlength="20" name="txtLastName" /></p> <p>Age:<input type="text" size="30" maxlength="3" name="txtAge" /></p> <p>Email Address:<input type="text" size="30" maxlength="50" name="email" /></p> <p><input type="button" value="Submit Registration" name="butChkForm" onclick="callFuncs_onclick()" /> <input type="reset" value="Reset" name="resetForm" /></p> </fieldset> </form> JavaScript: Code: //CALLING THE FORM SCRIPTS// function callFuncs_onclick() { chkForm_onclick(); creatingDatabase_onclick(); } //**************FORM VALIDATION***************// function chkForm_onclick() { var theForm = document.regForm; if (theForm.txtFirstName.value == "" || theForm.txtLastName.value == "" || theForm.txtAge.value == "" || theForm.email.value == "") { alert("Please complete all of the form."); if (theForm.txtFirstName.value == "") { theForm.txtFirstName.focus(); } if (theForm.txtLastName.value == "") { theForm.txtLastName.focus(); } if (theForm.txtAge.value == "") { theForm.txtAge.focus(); } if (theForm.email.value == "") { theForm.email.focus(); } } else if (isNaN(theForm.txtAge.value)) { alert("That is not valid input for this field. Please re-enter your age."); theForm.txtAge.focus(); } else { alert("Thank you for completing the form, " + theForm.txtFirstName.value); } } function creatingDatabase_onclick() { var form = document.regForm; var index = form.input[0].value; alert(index); } I'm not quite sure where I am going wrong. Please note that these functions really labour the point, I know I have way too many lines of code but I am still very amateur with JS. Thank you for any help/information. Kind Regards, LC. |