2D array to populate a select box.

[Yelellav]

Below I have attached some code that is populating a select box. It is reeaing a CF query into a JS 1D array and outputting the array into a selsect box. My problem is that I want to make the JS array 2D and when I try to do this, nothing works. If anyone can help out I would appreciate it.


1D Array (Working)
=====================================================================
<cfoutput query=&quot;project_array&quot; group=&quot;div&quot;>
<cfoutput group=&quot;sec&quot;>
// Create the array
projectArray#div##sec# = new Array(1);
<cfset x = 0>
// Populate the array
<cfoutput>
<cfset x = x + 1>
projectArray#div##sec#[#x#]= #id#;
</cfoutput>
</cfoutput>
</cfoutput>

// Function to populate the sections for the division selected
function PopulateProject()
{
// Only process the function if the first item is not selected.
if (document.qa_review.section.selectedIndex != -1)
{
// Find the division and section
var thisDiv = document.qa_review.division[document.qa_review.division.selectedIndex].value;
var thisSec = document.qa_review.section[document.qa_review.section.selectedIndex].value;

// Set the length of the section drop down equal to the length of the division array
document.qa_review.project.length = eval(&quot;projectArray&quot; + thisDiv + thisSec + &quot;.length&quot;

// Put 'Select' as the first option in the section drop-down
document.qa_review.project[0].value = &quot;&quot;;
document.qa_review.project[0].text = &quot;-Select-&quot;;
document.qa_review.project[0].selected = true;

// Loop through the division array and populate the section drop down.
for (x=1; x<eval(&quot;projectArray&quot; + thisDiv + thisSec + &quot;.length&quot; x++)
{
document.qa_review.project[x].value = eval(&quot;projectArray&quot; + thisDiv + thisSec + &quot;[x]&quot;
document.qa_review.project[x].text = eval(&quot;projectArray&quot; + thisDiv + thisSec + &quot;[x]&quot;
}
}
}

Attempt at 2D Array (Not Working)
Array works fine, but drop down will not populate.
=================================================================
<cfoutput query=&quot;project_array&quot; group=&quot;div&quot;>
<cfoutput group=&quot;sec&quot;>
// Create the array
projectArray#div##sec# = new Array(2);
<cfset x = 0>
// Populate the array
<cfoutput>
<cfset x = x + 1>
projectArray#div##sec#[#x#][1]= #id#;
projectArray#div##sec#[#x#][2]= #name#;
</cfoutput>
</cfoutput>
</cfoutput>

// Function to populate the sections for the division selected
function PopulateProject()
{
// Only process the function if the first item is not selected.
if (document.qa_review.section.selectedIndex != -1)
{
// Find the division and section
var thisDiv = document.qa_review.division[document.qa_review.division.selectedIndex].value;
var thisSec = document.qa_review.section[document.qa_review.section.selectedIndex].value;

// Set the length of the section drop down equal to the length of the division array
document.qa_review.project.length = eval(&quot;projectArray&quot; + thisDiv + thisSec + &quot;.length&quot;

// Put 'Select' as the first option in the section drop-down
document.qa_review.project[0].value = &quot;&quot;;
document.qa_review.project[0].text = &quot;-Select-&quot;;
document.qa_review.project[0].selected = true;

// Loop through the division array and populate the section drop down.
for (x=1; x<eval(&quot;projectArray&quot; + thisDiv + thisSec + &quot;.length&quot; x++)
{
document.qa_review.project[x].value = eval(&quot;projectArray&quot; + thisDiv + thisSec + &quot;[x][1]&quot;
document.qa_review.project[x].text = eval(&quot;projectArray&quot; + thisDiv + thisSec + &quot;[x][2]&quot;
}
}
}

 

[joeoz]

You need to make the following changes and it should work:

(1) Change the original array declaration.
projectArray#div##sec# = new Array(2);
The above only creates a 1-D array of length two. It should be:
projectArray#div##sec# = new Array();
You don't need to specify a length.

(2) Before setting the elements you need to create the secone dimension.
projectArray#div##sec#[#x#][1]= #id#;
projectArray#div##sec#[#x#][2]= #name#;
The above line doesn't work because the second dimension doesn't exist yet. It should be:
projectArray#div##sec#[#x#] = new Array(2);
projectArray#div##sec#[#x#][1]= #id#;
projectArray#div##sec#[#x#][2]= #name#;

That should work.

 

[JeroenB]

Hi,

maybe, to be perfectly clear, I should correct my script like this.

This still doesn't is what it should be,
could please someone help me out ?

thanx

//---->
.........
.........
.........
function sec_form()
{
document.adres.contact.length=Sel3D.length

for (i=0;i<Sel3D.length;i++)
{
var ArrayOfStrings = Sel3D.split(&quot;|&quot
document.adres.contact.options.text= ArrayOfStrings [0];
document.adres.contact.options.value = ArrayOfStrings [1];
}

pav_form();
pav_unit();


}

function pav_form()
{
nr1 = document.adres.contact.options.selectedIndex;
document.adres.project.length=Sel3D[nr1].length-1

for (i=1;i<Sel3D[nr1].length;i++)
{
var ArrayOfStrings = Sel3D[nr1].split(&quot;|&quot
document.adres.project.options[i-1].text = ArrayOfStrings [0];
document.adres.project.options[i-1].value = ArrayOfStrings [1];
}

pav_unit();
}

function pav_unit()
{
nr1 = document.adres.contact.options.selectedIndex;
nr2 = document.adres.project.options.selectedIndex+1;
document.adres.subproject.length=(Sel3D[nr1][nr2].length)-1

for (i=1;i<(Sel3D[nr1][nr2].length);i++)
{
var ArrayOfStrings = Sel3D[nr1] [nr2] .split(&quot;|&quot
document.adres.subproject.options[i-1].text = ArrayOfStrings [0];
document.adres.subproject.options[i-1].value = ArrayOfStrings [1];
}
}

 

[Yelellav]

Based on your response I think I may only want a 1-D array of length two. The array I had was what I was expecting (when I looked at the view source), but I can not get it to populate the select box correctly either way.