JavaScript - Trouble With Array
Hi i start of with a some csv data and convert this into an array. The resulting array looks like the following
[["Apple", "64"], ["Banana", "20"], ["pear", "12"], ["Orange", "16"]] But i need this to be formatted as below without the quotes around the second value. [["Apple", 64], ["Banana", 20], ["pear", 12], ["Orange", 16]] Im not sure how to achieve this. I guess i need to loop through the array and strip out the quotes but im failing to get this working. Help! Similar TutorialsI'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> I am trying to sort an array of strings based on the location of a string called "this.oText.value" inside an array of strings called "aList." If "this.oText.value" comes earlier in an entry in aList (call it "a") than another entry "b", I want "a" to appear before "b". Clearly, there is something very wrong with my code. It really isn't doing anything as of right now. Code: aList.sort(sortArray); function sortArray(a,b) { if(a.toLowerCase().indexOf(this.oText.value.toLowerCase()) < b.toLowerCase().indexOf(this.oText.value.toLowerCase())) return 1; else if(a.toLowerCase().indexOf(this.oText.value.toLowerCase()) > b.toLowerCase().indexOf(this.oText.value.toLowerCase())) return -1; else return 0; } 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 I have an array, I can not figure out how to take myTemplateholder = myTemplateholder.replace(" "+children[child],children[child]+"<div id='questionRadio'><input type='radio' name='answer' value='Y' /> Y <input type='radio' name='answer' value='N' /> N <input type='radio' name='answer' value='NA' /> N/A<br /></div>");} to display to separate lines. Right now, if there is more than one value, it gets added together. Here's the rest of the code: Code: function showText(){ // var myTemplateholder = document.getElementById('myTemplateholder').innerHTML; // document.getElementById('showMe').innerHTML = myTemplateholder; var children = new Array('Chills','Fatigue','Fever','Health History','Screening','Eye-ROS','Skin','Assessment','General Appearance','Vitals','Hearing','200','300','400','500'); var myTemplateholder = $('#myTemplateholder').text(); myTemplateholder = myTemplateholder.replace("Sections ",""); myTemplateholder = myTemplateholder.replace("History","<div id='templateHeader'>History</div>"); myTemplateholder = myTemplateholder.replace("ROS","<div id='templateHeader'>ROS</div><br>"); myTemplateholder = myTemplateholder.replace("Exam","<div id='templateHeader'>Exam</div>"); myTemplateholder = myTemplateholder.replace("ICD9","<div id='templateHeader'>ICD9</div>"); for(child in children) { myTemplateholder = myTemplateholder.replace(" "+children[child],children[child]+"<div id='questionRadio'><input type='radio' name='answer' value='Y' /> Y <input type='radio' name='answer' value='N' /> N <input type='radio' name='answer' value='NA' /> N/A<br /></div>"); } $('#showMe').html(myTemplateholder); } I'm totally stuck! Thanks for bearing with a newbie - any help would be greatly appreciated. Array.prototype.each = function (fn) { this.map(fn) } This is my each function that works great in every other browser but IE. UGH! What am I doing wrong? the error points to the this in the function. Is it that IE doesn't like map? Has anyone seen this before? I thought my code was correct. Works perfect in FF, chrome and opera. the canvas text doesn't work in opera, but it does render the features so the each function is working. I'll post the code if needed, but it's huge. here's the script running. http://www.pdxbusiness.com/canvas/golf/ Short version: I'm having trouble with "moving subarrays" in a multidimensional associative array. Long version: (Yes, I know that there's technically no such thing as a js associative array and that I'm actually using a generic object.) This is one of those annoying questions for which significant code can't be shown. I'm fetching a JSON object from PHP and parsing it as multi-dimensional associative array that comes out with this "structure": Code: obj[regions][variables][years] = value; My presentation logic works fine for that. Year data is presented for each variable, and variables are grouped by region. For reference, if needed, the display is tabular and similar to this: Code: Regions | Variables | 2003 | 2004 | 2005 ========================================= | measure1 | abcd | efgh | ijkl ================================= county1 | measure2 | mnop | qrst | uvwx ================================= | measure3 | yzab | cdef | ghij ========================================= | measure1 | abcd | efgh | ijkl ================================= county2 | measure2 | mnop | qrst | uvwx ================================= | measure3 | yzab | cdef | ghij ========================================= | measure1 | abcd | efgh | ijkl ================================= county3 | measure2 | mnop | qrst | uvwx ================================= | measure3 | yzab | cdef | ghij ========================================= | measure1 | abcd | efgh | ijkl ================================= county4 | measure2 | mnop | qrst | uvwx ================================= | measure3 | yzab | cdef | ghij ========================================= My problem comes from trying to allow the option to reorganize the grouping - that is, turning it into regions grouped by variable. The display logic can handle it, but I can't get the array handling code right. The desired secondary structure is Code: obj[variable][region][year] = value; Some things I've tried: Code: /* obj is in the format of obj[region][variable][year] = value */ data_arr = new Array(); for (var region in obj) { for (var variable in obj[region]) { for (var year in obj[region][variable]) { /* fail one */ data_arr[variable][region][year] = obj[region][variable][year]; /* data_arr[variable] is undefined */ /* fail two */ y = obj[region][variable][year]; y_arr = new Array(); y_arr[year] = y; r_arr = new Array(); r_arr[region] = y_arr; data_arr[variable] = r_arr; /* only the values from the last iteration are displayed */ /* fail three */ y = obj[region][variable][year]; y_arr = new Array(); y_arr[year].push(y); r_arr = new Array(); r_arr[region].push(y_arr); data_arr[variable].push(r_arr); /* y_arr[year] is undefined */ } } } And then other permutations of those three. I could run through it easy if not needing the textual index, but that's actually part of my display data, so it has to stay. Can anyone help me with what I'm overlooking? I am working on a page where the user will select a location from a dynamically generated dropdown list. I was able to create the php multidimensional array (tested and working) from a MySql database using the users information at login, but I'm having problems converting it to a javascript multidimensional array. I need to be able to access variables that I can pass to a number of text fields within an html form. For instance, if a user belongs to a company with multiple addresses, I need to be able to let them select the address they need to prepopulate specific text fields. php array creation: Code: if ($row_locations) { while ($row_locations = mysql_fetch_assoc($locations)) { $mail[$row_locations['comp_id']]=array('mailto'=>$row_locations['mailto'], 'madd'=>$row_locations['madd'], 'madd2'=>$row_locations['madd2'], 'mcity'=>$row_locations['mcity'], 'mstate'=>$row_locations['mstate'], 'mzip'=>$row_locations['mzip'], 'billto'=>$row_locations['billto'], 'badd'=>$row_locations['badd'], 'badd2'=>$row_locations['badd2'], 'bcity'=>$row_locations['bcity'], 'bstate'=>$row_locations['bstate'], 'bzip'=>$row_locations['bzip']); } } javascript function - this should create the array and send variables to text fields. Code: function updateAddress() { var mail = $.parseJSON(<?php print json_encode(json_encode($mail)); ?>); { if (comp_id in mail) { document.getElementById('mailto').value=mail.comp_id.mailto.value; document.getElementById('madd').value=mail.comp_id.madd.value; document.getElementById('madd2').value=mail.comp_id.madd2.value; document.getElementById('mcity').value=mail.comp_id.mcity.value; document.getElementById('mstate').value=mail.comp_id.mstate.value; document.getElementById('mzip').value=mail.comp_id.mzip.value; } else { document.getElementById('mailto').value=''; document.getElementById('madd').value=''; document.getElementById('madd2').value=''; document.getElementById('mcity').value=''; document.getElementById('mstate').value=''; document.getElementById('mzip').value=''; } } } Where is this breaking? Thanks in advance. OK i really hope someone can help me because this has put a complete halt to what I'm doing right now. i have various images in a 12x12 grid with names such as x1y1, x2y2, ect I need to check what x1y1's image SRC is. I have been trying stuff like this: var xpos = 1 var ypos = 1 var IMAGENAME = "x" + xpos + "y" + ypos blah = ('document.' + IMAGENAME + '.src') if (blah == "something.gif") { do what i want } Just doesn't work, nor has the 80 other things I've tried lol. Can anyone help me out? I have a form that does not validate when in a modal. Here is the page: http://www.varsitytrainers.com/purchase1.html It works well. It does not work when viewed on this page: http://www.varsitytrainers.com/bosto...ltrainers.html - Then click "Apply Now" and then click "Featured Membership" then click "Submit" You will see that the validation does not take place. I have been banging my head against the desk for days now. Please help. I can't seem to figure out how to accomplish this. In my website, I would like the user to input text into a single or multiple textbox(es) and then have the contents of the textbox(es) stored to either a variable or an array. Then I would like to have that variable/array compared to other arrays. Basically, the user is searching for items in a database. The user can search for as many or as little items as they want. Then the item(s) will be compared to multiple arrays to find out if what the user wants is in the database. So for example, let's say the user is searching for recipes that have all or part of these ingredients: chicken, broccoli, lemon, honey. So, there would have been a total of 4 textboxes...one for each ingredient. These ingredients are stored to an array..lets call it ingredient(). In the database of recipes, each recipe has its own array which includes the ingredients needed to make the recipe, we'll call them tag1(), tag2(), and tag3(). Now, I want the array, ingredient(), to be compared to each of the "tag" arrays to see if any of the "tag" arrays include exactly match the ingredient() tag in part or in whole. Is this possible? I have the following array that contain the people who are on off on certain time: Code: var all = [ ["1234", "Jim", "2011-10-23 00:00:00", "2011-10-25 07:00:00"], ["1235", "Jack", "2011-10-21 00:00:00", "2011-10-21 08:00:00"], ["1236", "Jane", "2011-10-11 00:00:00", "2011-10-11 00:30:00"], ["1237", "June", "2011-10-20 00:00:00", "2011-10-20 12:00:00"], ["1238", "Jill", "2011-10-14 00:00:00", "2011-10-14 11:00:00"], ["1239", "John", "2011-10-16 00:00:00", "2011-10-16 10:30:00"], ["1240", "Jacab", "2011-10-19 00:00:00", "2011-10-20 08:30:00"] ]; The above array, I wish to use javascript to insert into the FullCalendar (http://arshaw.com/fullcalendar/). I notice that the only way seems to be using the FullCalendar array style (or structure) as follows: Code: $('#calendar').fullCalendar({ events: [ { title : 'event1', start : '2010-01-01' }, { title : 'event2', start : '2010-01-05', end : '2010-01-07' }, { title : 'event3', start : '2010-01-09 12:30:00', allDay : false // will make the time show } ] }); So, the question is: How do I insert my array to match with the FullCalendar array? cause FullCalendar array had a different array structure from my array - and I don't think so that I can write in this way: Code: $('#calendar').fullCalendar({ events:all }); Appreciate any help provided. Hey guys, I'm hoping this is possible or that there is an easier way to do this. I'm having an issue with displaying data from one array that contains information about users in a table that is controlled by a different array. Is it possible to do this or is this use of arrays to display the data the wrong approach? The table is located on one webpage, I simply want to extract one piece of information that I have placed in the initial array as part of the login script that contains user information (for validation for login etc) and display it in a table on the new webpage that is opened as a result of successful validation of the user details. I'm completely stumped and after many attempts I just can't seem to get it to work. I am working on converting something and this is what I have come up with: http://www.msnsportsnet.com/content/ravenstest.htm The width of the original file was 845 px, I needed to change it to 235 px though. As I have knocked the size down of everything, I noticed the arrows are now not working correctly. The arrow only goes to the right once and to the left once, I need to it to go to the right and left multiple times. Here is the javascript file that I have been working with: Code: // gameday scroller function scrollGameday(dir) { var cssDir= (dir<0) ? 'right':'left'; var scrollWidth = 235; var scrollSpeed = 235; var scrollWrapLeft = parseInt($("#gameScroller").css("left")); if(okScroll == false) { return; } if(cssDir == "left") { if($("#arrowRight").hasClass("disable")) $("#arrowRight").removeClass('disable'); if(currentPane <= 1) { return; } else { scrollWrapLeft = (scrollWrapLeft + (dir * scrollWidth)); okScroll = false; $("#gameScroller").animate({left: scrollWrapLeft+"px"}, scrollSpeed, function() { okScroll = true; }); currentPane = currentPane-dir; if(currentPane <= 1) { if(!$("#arrowLeft").hasClass("disable")) $("#arrowLeft").addClass('disable'); } } } if(cssDir == "right") { if($("#arrowLeft").hasClass("disable")) $("#arrowLeft").removeClass('disable'); if(currentPane >= paneCount) { if(!$("#arrowRight").hasClass("disable")) $("#arrowRight").addClass('disable'); return; } else { scrollWrapLeft = (scrollWrapLeft + (dir * scrollWidth)); okScroll = false; $("#gameScroller").animate({left: scrollWrapLeft+"px"}, scrollSpeed, function() { okScroll = true; }); currentPane = currentPane-dir; if(currentPane >= paneCount) { if(!$("#arrowRight").hasClass("disable")) $("#arrowRight").addClass('disable'); } } } checkCurrentPane(currentPane); } function checkCurrentPane(currentPane) { alert('check'); if(currentPane == 1) { if(!$("#arrowLeft").hasClass("disable")) $("#arrowLeft").addClass('disable'); } else if(currentPane == paneCount) { if(!$("#arrowRight").hasClass("disable")) $("#arrowRight").addClass('disable'); } } $("#gameScroller").each(function (i) { var scrollWidth = 235; var newLeftPos = (i * scrollWidth)+"px"; $("#gameScroller:eq("+i+")").css("left", newLeftPos); var items = $('.game'); $('#gameScroller').css('width', items.length * items[0].offsetWidth + 'px'); $("#arrowLeft").click(function() { scrollGameday(3); return false; }); $("#arrowRight").click(function() { scrollGameday(-2); return false; }); }); if("#gameScroller") { var okScroll = true; var currentPane = 1; var paneCount = Math.ceil(($(".game").length) / 10); if(paneCount <= 1) { $(".arrow").className = $(".arrow").className + ' disable'; } else if (paneCount > 1) { $("#arrowLeft").addClass('disable'); } preScroll(); } function preScroll() { var games = $('.game'); for(n=0; n<games.length; n++) { if(games[n].className.match('active')) { var currFrame = Math.floor(n/10); scrollGameday(-currFrame); } } } This is the CSS file: http://www.msnsportsnet.com/content/ravens.css Thank you very much and any help is much appreciated. I am working on converting something and this is what I have come up with: http://www.msnsportsnet.com/content/ravenstest.htm However, the width of that is 845 px and I wanted it to drop down to 650 px and make the arrows have the same effect as they did with the 845 px. First I moved the 845 to 650 in the css file, then changed the 845 to 650 in the JS files, I have been unable to figure this out though. If someone could please help that would be great! This is the JS file that I tried to edit: http://www.baltimoreravens.com/includes/jsbin/ravens.js This is the css file: http://www.msnsportsnet.com/content/ravens.css I am getting an error: "document.getElementById("gender") is null" Any ideas how I can get this to work? Code: <head> <script type="text/javascript"> var selected = document.getElementById("gender").selectedIndex; var lname = document.getElementById("lastname"); var boyarray=new Array(); boyarray[0]="Joseph James"; boyarray[1]="Robert Michael"; boyarray[2]="Brian Shawn"; boyarray[3]="Joseph Duke"; var boymax=(boyarray.length - 1); var boychoose = Math.round(Math.random() * boymax); var girlarray=new Array(); girlarray[0]="Christine Louise"; girlarray[1]="Cheyenne Lynn"; girlarray[2]="Kelly Anne"; girlarray[3]="Julia Marie"; var girlmax=(girlarray.length - 1); var girlchoose = Math.round(Math.random() * girlmax); function randomname() { if (selected = "2") { alert((girlarray[girlchoose]) + lname); } else if (selected="1") { alert((boyarray[boychoose]) + lname); } else { alert("Please select a gender."); } } </script> </head> <body> <form onsubmit="randomname(this);"> Last Name:<input type="text" name="lastname" id="lastname"/> <br/> Gender: <select id="gender"> <option value="0">Please select a gender</option> <option value="1">Boy</option> <option value="2">Girl</option> </select> <br/> <input type="submit" id="submit" name="submit" value="Submit"/> </form> </body> 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 all, I have created the following page http://kylehouston.com/new/index_new.html I have used JQuery to add animated load icon followed by my images fading in, the load works fine and the images appear but the problem is the fade in wont work. I have tried a few methods to try and get them to fade including adding spans round my images but the only thing that seems to work for me is setting all divs to fade in which I dont want to happen. Anyone got any advice? Thanks in advance! Kyle Someone tell me where I'm going wrong. I'm trying to print out the month/year ? Code: <html><head> <SCRIPT language=JavaScript> var dateNow = new Date(); var monthNow = dateNow.getMonth(); var yearNow = dateNow.getYear(); function MakeArray(n) { this.length = n return this } monthNames = new MakeArray(12) monthNames[1] = "Janurary" monthNames[2] = "February" monthNames[3] = "March" monthNames[4] = "April" monthNames[5] = "May" monthNames[6] = "June" monthNames[7] = "July" monthNames[8] = "August" monthNames[9] = "Sept." monthNames[10] = "Oct." monthNames[11] = "Nov." monthNames[12] = "Dec." function customDate(oneDate) { var theMonth = monthNames[oneDate.getMonth() +1] } </SCRIPT> </head><body><script type="text/javascript"> document.write(theMonth + "/" + yearNow); </script> </body></html> Hello, I am researching an issue in a rather big app which displays pdf files in IE window. The issue is that inside javascript code we call 'window.setTimeout( win.focus() ...)' (for the child window), but it doesn't come into focus every time, seems a bit random when it does and does not come into focus. At present I wrote a much smaller app + javascript to reproduce the issue, but it does not manifest in same way. Specifically this is the confusing part: window.setTimeout( function() {win.focus(); win.moveTo( 200 , 200 ); } , 500 , "JavaScript" ); the 'win' does move, but never comes into focus. Any ideas about why the focus function does not accomplish what I'm trying to do? Here's the code of my simplified app + html + javascript: JAVASCRIPT: Code: var win; function f(s) { website="http://machine/apache/jsfnu/mytest" + s + ".txt"; if (!win) win = window.open( website , "thetest" , "toolbar=yes,resizable=yes"); else { win.url = website; } win.navigate(website); win.focus(); window.setTimeout( function() {win.focus(); win.moveTo( 200 , 200 ); } , 500 , "JavaScript" ); } function emitApplet() { document.write("<APPLET CODE=\"mytest.class\" archive=\"mytest.jar,netscape.jar\" NAME=\"myApplet\" MAYSCRIPT HEIGHT=1000 WIDTH=1000> </APPLET>"); } function window_onUnload() { } JAVA code: Code: import netscape.javascript.*; import java.awt.*; import java.awt.event.*; public class mytest extends java.applet.Applet implements ActionListener { Button nextButton; Button prevButton; int _page=1; public void init() { System.err.println("init started"); setLayout(new FlowLayout()); System.err.println("setLayout done"); nextButton = new Button("Next!"); System.err.println("next button created"); prevButton = new Button("Prev!"); System.err.println("prev button created"); add(prevButton); System.err.println("prev button added"); add(nextButton); System.err.println("next button added"); nextButton.addActionListener(this); System.err.println("next button action"); prevButton.addActionListener(this); System.err.println("prev button created"); } public void actionPerformed(ActionEvent evt) { if (evt.getSource() == nextButton) { doButton(++_page); } else if (evt.getSource() == prevButton) { doButton(--_page); } } public void doButton(int page) { JSObject win = JSObject.getWindow(this); JSObject doc = (JSObject) win.getMember("document"); JSObject loc = (JSObject) doc.getMember("location"); String s = (String) loc.getMember("href"); String []args = new String[1]; args[0] = (new Integer(page)).toString(); win.call("f", args); } public void paint (java.awt.Graphics g) { g.drawString("Hello, World9!",50,25); } } HTML: Code: <script type="text/javascript" src="StartTest.js"> </script> <html> <head> <title>try</title> </head> <body bgcolor="#fdf8ed" text="black" language="Javascript" onload="window_onUnload()"> <center> <script type="text/javascript"> emitApplet(); </script> </center> </body> </html> Can anyone look at the link below, and tell me why the infoWindow displays the same xml marker node for each marker Thanks Lee http://www.hotels.seotra.com/ |