Solved

Dynamically change JavaScript index numbers of a multi dimension array in a function

Posted on 2006-10-22
2
755 Views
Last Modified: 2010-08-05
Hello,

I am trying to dynamically populate index numbers from a multi dimension array to a fuction using an input box and a get button to get that value of the dynamic index numbers. I have been able to loop then slice the values I want to dynamically convert [1][1][2] to 1][1][2 but when I put it together with my function and multi dimension array like this:

getMyStuff(getBugs[newBox];

I get undefined.

I’ve tried everything I can think of but nothing works. Note that getMyStuff(getBugs[1][1][2]); works, but I cannot seem to figure out how to get my array understand that when I put 1][1][2 with [    ]  to come up with [1][1][2] that I mean to do this:

getBugs[1][1][2]

The default values “1 1 2” in the page returns "debugging1_case2" and are good enough for testing. The goal of this code is to take the values from the input box, populate that value to dynamically change getBugs multi dimension index numbers to print that value in the output window.

Thanks!

Dan

Here is the link:

http://www.xpilot.us/dev/Q_22033345/multi_dimension_array.htm

Here is the code:

<script language="JavaScript" type="text/javascript">
 
var getBugs = [
                ["debugOn","debugOff"], // [0][0]
                   [["start_debugging1","end_debugging1"], // [1][0][0] [1][0][1]
                    ["first 0 of 1","debugging1_case1","debugging1_case2"]], // [1][1][0] [1][1][1] [1][1][2]
                   [["start_debugging2","end_debugging2"], // [2][0][0] [2][0][1]
                    ["debugging2_case1"]], // [2][1][0]
                   [["start_debugging3","end_debugging3"], // [3][0][0] [3][0][1]
                    ["debugging3_case1"]], // [3][1][0]
                ["*test I am [4][0]*","*test I am [4][1]*","*test I am [4][2]*"] // [4][0] [4][1] [4][2]
              ];
 
function getMyStuff(var1){
var x=document.getElementById("debugWindow_2").innerHTML;
x=x+var1+"<br>";
document.getElementById("debugWindow_2").innerHTML=x;
}
 
function callMyStuff(var2){
var indexNum = var2.form.multiIndex.value.split(" ");
alert(indexNum);
var myBox = new Array();
for(i=0;i<indexNum.length;i++){
myBox = myBox+"["+indexNum[i]+"]";
}
alert(indexNum);
var boxEnd = myBox.length;
var newBox=myBox.slice(1,boxEnd-1);
alert(newBox);
getMyStuff(getBugs[newBox]); // This is the line I want to dynamically return getBugs multi dimension array values such as [1][1][2]
// getMyStuff(getBugs[1][1][1]);
// getMyStuff(getBugs[3][0]);
// getMyStuff(getBugs[1][0]);
}
 
</script>
0
Comment
Question by:7string
2 Comments
 
LVL 5

Accepted Solution

by:
daohailam earned 500 total points
ID: 17783520
...
// Should be like this
getMyStuff(eval('getBugs['+newBox+']'));

...
0
 

Author Comment

by:7string
ID: 17784124

Thanks for the help! getMyStuff(eval('getBugs['+newBox+']')); did it. I would have NEVER got this on my own. What a great example for the use of eval()

Many thanks!

Dan

I cleaned up the code and renamed some of the variables.

Here is the updated link:

http://www.xpilot.us/dev/Q_22033345/multi_dimension_array.htm

Here is the new code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Q_22033345 Multi Dimension Array Index Numbers</title>
<style type="text/css">
body, table, td { font-size: 14px; padding: 0; }
/* Debugging Style */
div#myScrollBar { width:2000px; height: 200px; overflow: scroll; }
table#outputWindow_1 { position:absolute; z-index:2; left:5px; top:355px;}
table#outputWindow_1 td.someInfo_2a { height: 20px; text-align: left;}
table#outputWindow_1 td.someInfo_2b { height: 200px; font-size: 13px; text-align: left;}
</style>
 
<script language="JavaScript" type="text/javascript">

var getBugs = [
                ["debugOn","debugOff"], // [0][0]
                   [["start_debugging1","end_debugging1"], // [1][0][0] [1][0][1]
                    ["first 0 of 1","debugging1_case1","debugging1_case2"]], // [1][1][0] [1][1][1] [1][1][2]
                   [["start_debugging2","end_debugging2"], // [2][0][0] [2][0][1]
                    ["debugging2_case1"]], // [2][1][0]
                   [["start_debugging3","end_debugging3"], // [3][0][0] [3][0][1]
                    ["debugging3_case1"]], // [3][1][0]
                ["*test I am [4][0]*","*test I am [4][1]*","*test I am [4][2]*"] // [4][0] [4][1] [4][2]
              ];

function getMyStuff(var1){
   var x=document.getElementById("debugWindow_1").innerHTML;
   x=x+var1+"<br>";
   document.getElementById("debugWindow_1").innerHTML=x;
}

function callMyStuff(var2){
   var indexNum = var2.form.multiIndex.value.split(" ");
   var getDynMltiDimIndx = new Array(); /* getDynMltiDimIndx is abbreviated and its purpose is to get_Dynamic_Multi_Dimension_Index_Numbers */
   for(i=0;i<indexNum.length;i++){
      getDynMltiDimIndx = getDynMltiDimIndx+"["+indexNum[i]+"]";
   }
   var getDynMltiDimIndx=getDynMltiDimIndx.slice(1,getDynMltiDimIndx.length-1);
   if(getDynMltiDimIndx == ""){                           /* This is to return the entire multi dimension array */
      getMyStuff(getBugs);
   }else{                                                 /* return getDynMltiDimIndx index numbers below to see it is */
   document.getElementById("debugWindow_1_Title").innerHTML=getDynMltiDimIndx;
   getMyStuff(eval('getBugs['+getDynMltiDimIndx+']'));    /* New line that puts 1][1][2 together with [] to return getBugs[1][1][2] */
   }
// getMyStuff(getBugs[getDynMltiDimIndx]); /* Old line that would not combine 1][1][2 with [] to return getBugs[1][1][2] */
// getMyStuff(getBugs[1][1][1]); /* Hard code in the multi dimension index numbers to get their values */
}

</script>
</head>
<body>
<table width="1000" border="0"><tr><td>
<p>Below is to look at the getBugs Multi Dimension Array (Or getBugs Nested Array) to
understand their index numbers and how to access them to return their values.
<br><br>Input values must be numbers with with one space in-between them like "1 1" or a single number like "1"
<br>or no value at all to get the entire Array. (No numbers or white space etc.) Anything else and the script will error.
<br>I didn't code in anything to protect that for this example.</p>
<pre>
var getBugs = [
                ["debugOn","debugOff"], // [0][0]
                   [["start_debugging1","end_debugging1"], // [1][0][0] [1][0][1]
                    ["first 0 of 1","debugging1_case1","debugging1_case2"]], // [1][1][0] [1][1][1] [1][1][2]
                   [["start_debugging2","end_debugging2"], // [2][0][0] [2][0][1]
                    ["debugging2_case1"]], // [2][1][0]
                   [["start_debugging3","end_debugging3"], // [3][0][0] [3][0][1]
                    ["debugging3_case1"]], // [3][1][0]
                ["*test I am [4][0]*","*test I am [4][1]*","*test I am [4][2]*"] // [4][0] [4][1] [4][2]
              ];
</pre>
<form>
Leave Box below blank (Backspace all the way to beginning so that no white spaces or numbers are present)
to return the entire getBugs Multi Dimension Array.

<br>Multi Dimension Array Index Number(s) <input type="text" name="multiIndex" size="40" value="1 1 2">

<input type="button" value="Get Index Number(s)" onClick="callMyStuff(this)">

</td></tr></table>

<table id="outputWindow_1" border="1">
<tr><td class="someInfo_2a"><div id="debugWindow_1_Title">Debug Window 1</div></td></tr>
<tr><td class="someInfo_2b"><div id="myScrollBar"><div id="debugWindow_1">&nbsp;</div></div></td></tr>
</table>

</form>
</body>
</html>
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In Part 1 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7849-Hex-Maze.html) we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

867 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

21 Experts available now in Live!

Get 1:1 Help Now