PDA

Click to See Complete Forum and Search --> : dynamic drop down menu and array

mbird
03-27-2003, 08:38 AM
I have be using the code in found on The Jaascript Source.

http://javascript.internet.com/forms/dropdown-box-population.html

However the data is coming from a database and I built the array from the database.

My question is:

In the example giving, I would like the pass an array into the function for variables arrItems1, arrItemsGrp1, arrItems2, and arrItemsGrp2.

<SELECT id=firstChoice name=firstChoice onchange="selectChange(this, myChoices.secondChoice, arrItems1, arrItemsGrp1);">

How would I change the code to pass an array into the function?

Any help would greatly appreciated.

Thanks,
M.

Sample Code:

<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function selectChange(control, controlToPopulate, ItemArray, GroupArray)
{
var myEle ;
var x ;
// Empty the second drop down box of any choices
for (var q=controlToPopulate.options.length;q>=0;q--) controlToPopulate.options[q]=null;
if (control.name == "firstChoice") {
// Empty the third drop down box of any choices
for (var q=myChoices.thirdChoice.options.length;q>=0;q--) myChoices.thirdChoice.options[q] = null;
}
// ADD Default Choice - in case there are no values
myEle = document.createElement("option") ;
myEle.value = 0 ;
myEle.text = "[SELECT]" ;
controlToPopulate.add(myEle) ;
// Now loop through the array of individual items
// Any containing the same child id are added to
// the second dropdown box
for ( x = 0 ; x < ItemArray.length ; x++ )
{
if ( GroupArray[x] == control.value )
{
myEle = document.createElement("option") ;
myEle.value = x ;
myEle.text = ItemArray[x] ;
controlToPopulate.add(myEle) ;
}
}
}
// End -->
</script>

</HEAD>

<BODY>

<form name=myChoices>
<table align="center">
<tr>
<td>
<SELECT id=firstChoice name=firstChoice onchange="selectChange(this, myChoices.secondChoice, arrItems1, arrItemsGrp1);">
<option value=0 SELECTED>[SELECT]</option>
<option value=1>Land</option>
<option value=2>Sea</option>
<option value=3>Air</option>
</SELECT>
</TD><TD>
<SELECT id=secondChoice name=secondChoice onchange="selectChange(this, myChoices.thirdChoice, arrItems2, arrItemsGrp2);">
</SELECT>
<SELECT id=thirdChoice name=thirdChoice>
</SELECT>
</TD>
</TR>
</TABLE>
</form>
mbird
03-31-2003, 01:33 PM
After doing some more digging, I was figure out my problem.

My solution was to built my array for a database within my javascript using VBScript.

Thanks,
MBird

<script language="javascript">
// build the aryLocation array
var aryLocation = new Array()
var aryLocationGroup = new Array()

<%
strParams = "SELECT DISTINCT Region FROM dbo.SHR_Location ORDER BY Region"
set RSDivisionAry = sqlconn2.execute(strParams)
intDivisionCount = intDivisionCount + 1
if not RSDivisionAry.eof then
'highKey = 0
do until RSDivisionAry.eof
strParams = "SELECT DISTINCT Site FROM dbo.SHR_Location WHERE Region = '" & RSDivisionAry("Region") & "' ORDER BY Site"

set RSLocationAry = sqlconn2.execute(strParams)


Do While Not RSLocationAry.EOF
intLocationCount = intLocationCount + 1
sDesc = left(RSLocationAry("Site"),25)
%>
aryLocation[<%=intLocationCount%>] = "<%=sDesc%>";
aryLocationGroup[<%=intLocationCount%>] = <%=intDivisionCount%>;
<%
RSLocationAry.MoveNext
loop
intDivisionCount = intDivisionCount + 1
RSDivisionAry.MoveNext
loop
end if
%>

var aryDepartment = new Array()
var aryDepartmentGroup = new Array()

<%
intLocationCount = 0
intDepartmentCount = 0
strParams = "SELECT DISTINCT Region FROM dbo.SHR_Location ORDER BY Region"
set RSDivisionAry = sqlconn2.execute(strParams)

if not RSDivisionAry.eof then
do until RSDivisionAry.eof
strParams = "SELECT DISTINCT Site FROM dbo.SHR_Location WHERE Region = '" & RSDivisionAry("Region") & "' ORDER BY Site"
set RSLocationAry = sqlconn2.execute(strParams)

Do While Not RSLocationAry.EOF
intLocationCount = intLocationCount + 1

strParams = "SELECT Department FROM dbo.SHR_Location WHERE (Site = '" & RSLocationAry("Site") & "') AND (Region = '" & RSDivisionAry("Region") & "') ORDER BY Department"
set RSDepartmentAry = sqlconn2.execute(strParams)

Do While Not RSDepartmentAry.EOF

intDepartmentCount = intDepartmentCount + 1

sDesc = left(RSDepartmentAry("Department"),25)

%>
aryDepartment[<%=intDepartmentCount%>] = "<%=sDesc%>";
aryDepartmentGroup[<%=intDepartmentCount%>] = <%=intLocationCount%>;
<% RSDepartmentAry.MoveNext
loop

RSLocationAry.MoveNext
loop

RSDivisionAry.MoveNext
loop
end if
%>
function selectChange(control, controlToPopulate, ItemArray, GroupArray)
{
var myEle ;
var x ;
// Empty the second drop down box of any choices
for (var q=controlToPopulate.options.length;q>=0;q--) controlToPopulate.options[q]=null;
if (control.name == "cboDivision") {
// Empty the third drop down box of any choices
for (var q=worksheet.cboDepartment.options.length;q>=0;q--) worksheet.cboDepartment.options[q] = null;
}
if (control.name == "cboCustomerDivision") {
// Empty the third drop down box of any choices
for (var q=worksheet.cboCustomerDepartment.options.length;q>=0;q--) worksheet.cboCustomerDepartment.options[q] = null;
}
// ADD Default Choice - in case there are no values
myEle = document.createElement("option") ;
myEle.value = 0 ;
myEle.text = "Choose One.." ;
controlToPopulate.add(myEle) ;
// Now loop through the array of individual items
// Any containing the same child id are added to
// the second dropdown box
for ( x = 0 ; x < ItemArray.length ; x++ )
{
if ( GroupArray[x] == control.value )
{
myEle = document.createElement("option") ;
myEle.value = x ;
myEle.text = ItemArray[x] ;
controlToPopulate.add(myEle) ;
}
}
}

</script>
mbird
03-31-2003, 03:36 PM
Another problem I'm having is a couple of submit buttons on the form. One of the submit buttons gathers the information from the form redisplays the information on the page.

My drop downs are dynamically displayed from an array and the second drop down depends on the first drop down.

Once the submit button is pressed and the information is posted back to the page, I able to get the information from the first drop down but I’m not able to get the information for the second drop down.

How do I get the information from the second drop down when the information is posted back to page?

Any help would be greatly appreciated..

MBird

<script language="javascript">
// build the aryLocation array
var aryLocation = new Array()
var aryLocationGroup = new Array()

<%
strParams = "SELECT DISTINCT Region FROM dbo.SHR_Location ORDER BY Region"
set RSDivisionAry = sqlconn2.execute(strParams)
intDivisionCount = intDivisionCount + 1
if not RSDivisionAry.eof then
'highKey = 0
do until RSDivisionAry.eof
strParams = "SELECT DISTINCT Site FROM dbo.SHR_Location WHERE Region = '" & RSDivisionAry("Region") & "' ORDER BY Site"

set RSLocationAry = sqlconn2.execute(strParams)


Do While Not RSLocationAry.EOF
intLocationCount = intLocationCount + 1
sDesc = left(RSLocationAry("Site"),25)
%>
aryLocation[<%=intLocationCount%>] = "<%=sDesc%>";
aryLocationGroup[<%=intLocationCount%>] = <%=intDivisionCount%>;
<%
RSLocationAry.MoveNext
loop
intDivisionCount = intDivisionCount + 1
RSDivisionAry.MoveNext
loop
end if
%>

function selectChange(control, controlToPopulate, ItemArray, GroupArray)
{
var myEle ;
var x ;
// Empty the second drop down box of any choices
for (var q=controlToPopulate.options.length;q>=0;q--) controlToPopulate.options[q]=null;
if (control.name == "cboDivision") {
// Empty the third drop down box of any choices
for (var q=worksheet.cboDepartment.options.length;q>=0;q--) worksheet.cboDepartment.options[q] = null;
}
if (control.name == "cboCustomerDivision") {
// Empty the third drop down box of any choices
for (var q=worksheet.cboCustomerDepartment.options.length;q>=0;q--) worksheet.cboCustomerDepartment.options[q] = null;
}
// ADD Default Choice - in case there are no values
myEle = document.createElement("option") ;
myEle.value = 0 ;
myEle.text = "Choose One.." ;
controlToPopulate.add(myEle) ;
// Now loop through the array of individual items
// Any containing the same child id are added to
// the second dropdown box
for ( x = 0 ; x < ItemArray.length ; x++ )
{
if ( GroupArray[x] == control.value )
{
myEle = document.createElement("option") ;
myEle.value = x ;
myEle.text = ItemArray[x] ;
controlToPopulate.add(myEle) ;
}
}
}


<SELECT id=cboDivision name=cboDivision onchange="selectChange(this, worksheet.cboLocation, aryLocation, aryLocationGroup);">
<option value="0">Choose A Division</option>

<% Do While Not RSDivision.EOF 'Loop through the Division
intDivision = intDivision + 1
If Request.Form("submit") = "Calculate" or blnNothingSelected Then

If int(Request.Form("cboDivision")) = intDivision Then %>
<option value=<%=intDivision%> selected><%=RSDivision("Region")%></option>
<% else%>
<option value=<%=intDivision%>><%=RSDivision("Region")%></option>

<% end if
else
%>
<option value=<%=intDivision%>><%=RSDivision("Region")%></option>

<%end if
RSDivision.MoveNext
loop 'Continue while records exist%>
</select>

<%'Second Drop Down%>

<SELECT id=cboLocation name=cboLocation onchange="selectChange(this, worksheet.cboDepartment, aryDepartment, aryDepartmentGroup);"></select>
mbird
04-01-2003, 07:38 AM
No, I don't have a live link. It's an application on our intranet.

MBird