Dynamic Forms with database access

LenLindquist · May 19, 2003

I would like to use a select-option drop-down box to select a library name from a data table and then, on the same form without yet submitting, dynamically change the next drop-down box to list the staff working at that particular library from another data table.

I figure this will at least require an onChange JavaScript function on the first select. But then how do I get that value and use it in the next drop-down with asp?

Thanks much,
Len

mwolf00 · May 19, 2003

When you say that you don't want to submit, do you mean that you don't want to make a server call? If you want to do the whole thing without calling the server a second time, then you need to send all the data tp the HTML page at the outset. All libraries go into 1 javascript array and then all the employees at each library go into an array for that library.... Something like this....

<script>
bkfstArr = new Array ("Ham and Eggs","Pancakes","Waffles","Cereal And Toast&quot

lnchArr = new Array ("BLT","Peanut Butter and Jelly","Grilled Cheese","Soup and Salad&quot

dnnrArr = new Array ("Pizza","Tacos","Hamburgers","Fried Chicken","Grilled Salmon","Lasagna&quot

function selectionMade(){
//see if the second Select has been created
allSelects = document.getElementsByTagName("select&quot

allSelects.length == 1 ? newSelect = false : newSelect = true;

//see if a selection has been made
if (allSelects[0].selectedIndex == 0){
if (newSelect){
allSelects[1].style.display = "none"
}
return false;
}
if (!newSelect){
// create the second select
nextSelect = allSelects[0].cloneNode(true)
nextSelect.id = "secondarySelect"
allSelects[0].parentNode.appendChild(nextSelect)
}
else{
// erase the second select
nextSelect = allSelects[1]
for (x=1; x<nextSelect.options.length; x++){
nextSelect.options[x] = null
}
nextSelect.style.display = "block"
}
// populate the second select
inputArr = eval(allSelects[0].options[allSelects[0].selectedIndex].value + "Arr&quot

for (x=0; x<inputArr.length; x++){
if (nextSelect.options[x]){
nextSelect.options[x].text = inputArr[x]
nextSelect.options[x].value = inputArr[x]
}
else{
newOption = document.createElement("option&quot

nextSelect.appendChild(newOption)
newOption.text = inputArr[x]
newOption.value = inputArr[x]
}
}
}
</script>

<body>
<form name="myForm">
<select name="mainSelect" onChange="selectionMade()">
<option value="">Choose Meal
<option value="bkfst">Breakfast
<option value="lnch">Lunch
<option value="dnnr">Dinner
</select><br>

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rich Cook

mumbojumbo · May 19, 2003

Did something similar myself, i used a url and built up the params to then load into a select

Corneliu · May 19, 2003

An example on asp101 samples web page:

http://www.asp101.com/samples/db_pulldown_linked.asp

I can give you an example if you do not understand the one above. My code is a little messy, but I can show it if needed.

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Dynamic Forms with database access

LenLindquist

IS-IT--Management

mwolf00

Programmer

mumbojumbo

Programmer

Corneliu

Technical User

Similar threads

Part and Inventory Search

Sponsor