asked on

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

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>

ASKER CERTIFIED SOLUTION

daohailam

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

7string

ASKER

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"> </div></div></td></tr>
</table>

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