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!

Register Log in
  • Congratulations bkrike on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Multiple select box db population....

Status
Not open for further replies.
scootaboy

scootaboy

Programmer
Apr 26, 2001
6
GB
Hi there, I'm new to javascript and have a problem.

I need to create a (multiple select) select box which when selected will populate a second select box sitting next to it.

Both select boxes will get their data from a coldfusion db query, with the second select box being populated depending on the choices made in the first one. I hope this makes sense.

I have the code for this for a non multiple select box, but I haven't seen an example of what I need anywhere.

Also it needs to work in both netscape and IE, versions 4.0 and above.

Any help/pointers will be greatly appreciated.
 
Sort by date Sort by votes
gets pretty complicated I like the usage of objects for this type of task. However multiple dimension arrays would be good as well.

Let me see what I can come up with in 5 minutes. Gary Haran
 
Upvote 0 Downvote
Yeah I looked at the problem.

Easy solution is to do multiple server calls. Sorry.

It could be done using JavaScript but this is a project in itself that would take about a week or two of coding. I'm not interested in doing this for free ;)

Sorry can't be more helpful. Gary Haran
 
Upvote 0 Downvote
I'm in the middle of trying to achieve the same thing.

I have things working almost.
The only problem is that when the 'default' 2nd select list consists of 3 items, then the 2nd select list will not show more than 3 options even if there are 4 or more in the list.
Try this code and select 'birds' and you'll know what I mean.

<html>
<head>
<title>Thau's JavaScript Tutorial</title>
<script language = &quot;JavaScript&quot;>
<!-- hide me
function swapOptions(the_array_name) {
var numbers_select = document.the_form.the_examples;
setOptionText(numbers_select, the_array_name);
}

function setOptionText(the_select, the_array) {
var dogs = new Array(&quot;poodle&quot;,&quot;puli&quot;,&quot;greyhound&quot;, &quot;abc&quot;);
var fish = new Array(&quot;trout&quot;, &quot;mackerel&quot;, &quot;bass&quot;);
var birds = new Array(&quot;robin&quot;, &quot;hummingbird&quot;, &quot;hawk&quot; , &quot;crow&quot;,&quot;crow2&quot;);
var the_array = eval(the_array);
for (loop = 0;loop < the_select.options.length; loop++) {
the_select.options[loop].text = the_array[loop];
the_select.options[loop].value = the_array[loop];
}
}
// show me -->
</script>
</head>
<body bgColor=&quot;#FFFFFF&quot;
text=&quot;#000000&quot; link=&quot;#3366CC&quot;
vLink=&quot;#9966CC&quot; aLink=&quot;#FF0000&quot; marginWidth=&quot;0&quot;
marginHeight=&quot;0&quot; topmargin=&quot;0&quot;
leftMargin=&quot;0&quot;>
<p align=&quot;center&quot;>
<b>My favorite animal is ...</b>
<form name=&quot;the_form&quot;>
<select name=&quot;choose_category&quot;
onchange=&quot;swapOptions(this.options[this.selectedIndex].value);&quot;>
<option selected value=&quot;dogs&quot;>dogs</option>
<option value=&quot;fish&quot;>fish</option>
<option value=&quot;birds&quot;>birds</option>
</select>
<select name=&quot;the_examples&quot;>
<option value=&quot;poodle&quot;>poodle</option>
<option value=&quot;puli&quot;>puli</option>
<option value=&quot;greyhound&quot;>greyhound</option>
</select>
</form>
<p>
</body>
</html>
 
Upvote 0 Downvote
This works for submitting from one select box to another. The only problem I have with it is not submitting to my action page. You may have a problem submitting to a database but maybe this will at least get you started. This script will allow you select as many items from the first select box and transfer them to the 2nd select box. Hope this helps and if you figure out how to get these items submitted to a database or action page, please let me know.

The Buckinator


<script type=&quot;text/javascript&quot;>

function OnTransferBtnClick(blnFromLeft)
{
var LeftListBox = document.forms[0].lstLeft;
var RightListBox = document.forms[0].lstRight;
var ListItems = new Array();
FromList = (blnFromLeft ? LeftListBox : RightListBox);
ToList = (blnFromLeft ? RightListBox : LeftListBox);
for(var i=(FromList.options.length - 1);i>=0;i--)
if(FromList.options.selected)
{
ListItems[ListItems.length] = new Option(FromList.options.text);
FromList.options = null;
}
<!----Added the following for loop to replace this for loop

for(var i=ListItems.length - 1;i>=0;i--)
ToList.options[ToList.options.length] = ListItems;
--->
for(var i=ListItems.length - 1;i>=0;i--) {
ToList.options[ToList.options.length - 1] = ListItems;
ToList.options.length++;
}
}

function OnBtnSubmitClick(f)
{
ListBox = document.forms[0].lstRight;
if(ListBox.options.length==0){
alert(&quot;You did not selection any item/items. Please choose an item/items from the left list box and transfer them to the right list box&quot;);
}
else
{
f.submit();
}
 
Upvote 0 Downvote
Thank you all very much for your replies, much appreciated!
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

malpa
  • Locked
  • Question
Graph the selection of a html table row
Replies
0
Views
836
malpa
malpa
chikwendu
  • Locked
  • Question
How do I display an extra input box for editing an existing data?
Replies
1
Views
300
chikwendu
chikwendu
berkshirea
  • Locked
  • Question
Dropdown, Select, Required 1
Replies
8
Views
525
berkshirea
berkshirea
keisha1
  • Locked
  • Question
How can I append/insert multiple text files into one .dbf file using java script /html command
Replies
1
Views
332
Samthyr
Samthyr
damipera
  • Locked
  • Question
Checkboxes - At Least 1 is Selected? 1
Replies
2
Views
332
damipera
damipera

Part and Inventory Search

Sponsor

Back
Top