PDA

View Full Version : Using Two Double Combos On A Page



TheFrameGuy
May 2nd, 2003, 09:52 PM
Is there a way I can use two Double Combos on one page? http://javascriptkit.com/script/cut183.shtml

I've tried modifying the code to work, but I still can not make it work. No matter what I modify, both of the first boxes on each combo set make the second box on the first combo set change rather than the first box on the first combo set making the second box change on the first combo set and the first box on the second combo set changing the second box on the second combo set.

tamienne
May 2nd, 2003, 09:58 PM
As you can see from that link it does work... how about posting some code or a link to your site so we can see what's wrong with your code.

TheFrameGuy
May 2nd, 2003, 10:07 PM
I think you misunderstood my question. Obviously the Double Combo Box code works. My question is placing two of them on one page and making it work. http://www.wcilivewell.com/test.htm

tamienne
May 2nd, 2003, 10:22 PM
sorry about the misunderstanding. This is what's wrong...

you're code sets temp twice so when you call the function it's using the temp as it was last assigned.

You can add this to your select statement


<select name="example2" size="1" onChange="redirect(this.options.selectedIndex,document.doublecombo2.stage2)">


then add the new parameter to your function


function redirect(x,temp){


it should work. by the way there doesn't look like there's a "document.doublecombo2.example" but there is a "document.doublecombo2.example2".

Hope it works out for ya

TheFrameGuy
May 3rd, 2003, 06:28 AM
Okay, this is getting close to working. http://www.wcilivewell.com/test.htm Now each first box of the combo set changes the second box, but each shows the content of the second combo set's second box.

TheFrameGuy
May 8th, 2003, 12:20 AM
I got close on this last week. Does anyone else have any ideas.

chrismiceli
May 8th, 2003, 12:23 AM
seems to work for me, could you describe your problem.

TheFrameGuy
May 8th, 2003, 03:59 PM
Thanks for responding to my question.

Take a look at this page - http://www.wcilivewell.com/test_orig.htm

And then this page -
http://www.wcilivewell.com/test_modified.htm

I've got a description on each page explaining the problem.

vialli
Aug 20th, 2003, 02:40 PM
Hi TheFrameGuy,

I too have been trying to resolve the exact same problem with have two identical combo boxes on the same page.

Using the replies you have received here along with ongoing tinkering I have got it to work..... I think, so Itry the following.

Basically having changed the names of the variables and inserting the extra line of code as mentioned above, i then renamed the function go in the second combo box to go2 and it has seemd to work.

If you want a copy of the code I used to get it to work, then please send me a PM and I will send it to you.

Hope this helps

Vincent Puglia
Aug 20th, 2003, 03:29 PM
Hi,

You are having problems because virtually everything is out in the open (global) and not enough is being passed as parameters.

Take a look at the code below especially the name changes. You can now have X number of combos.

You might also be interested to see the "Cascading Selects" scripts/tutorials at my site (GrassBlade).



<form name="doublecombo">
<p><select name="example" size="1" onChange="redirect(this.options.selectedIndex,this.form.stage2, group1)">
<option>Technology Sites</option>
<option>News Sites</option>
<option>Search Engines</option>
</select>
<select name="stage2" size="1">
<option value="http://www.members.aol.com/grassblad">GrassBlade</option>
<option value="http://www.wired.com">Wired News</option>
</select>
<input type="button" name="test" value="Go!"
onClick="go(this.form.stage2)">
</p></form><br>
<form name="doublecombo2">
<p><select name="example2" size="1" onchange="redirect(this.options.selectedIndex,this.form.stage2, group)">
<option>Registration Sites</option>
<option>Sports Sites</option>
<option>MP3 Sites</option>
</select>
<select name="stage2" size="1">
<option value="http://directnic.com">Directnic</option>
<option value="http://www.enom.com">eNom.com</option>
</select>
<input type="button" name="test" value="Go!"
onClick="go(this.form.stage2)">
</p>

</form>
</p>

<script>
<!--
var groups=document.doublecombo.example.options.length
var group1=new Array(groups)
for (i=0; i<groups; i++)
group1[i]=new Array()

group1[0][0]=new Option("GrassBlade","http://members.aol.com/grassblad")
group1[0][1]=new Option("Wired News","http://www.wired.com")

group1[1][0]=new Option("CNN","http://www.cnn.com")
group1[1][1]=new Option("ABC News","http://www.abcnews.com")

group1[2][0]=new Option("Hotbot","http://www.hotbot.com")
group1[2][1]=new Option("Infoseek","http://www.infoseek.com")



var groups=document.doublecombo2.example2.options.length
var group=new Array(groups)
for (var i = 0; i < groups; i++)
group[i]=new Array()

group[0][0]=new Option("Directnic","http://directnic.com")
group[0][1]=new Option("eNom.com","http://www.enom.com")

group[1][0]=new Option("NBA","http://www.nba.com")
group[1][1]=new Option("NFL","http://www.nfl.com")

group[2][0]=new Option("MP3.com","http://www.mp3.com")
group[2][1]=new Option("Napster","http://www.napster.com")


function redirect(ndx, targSel, srcArr)
{
for (var i=0; i < srcArr[ndx].length; i++)
targSel.options[i]=new Option(srcArr[ndx][i].text,srcArr[ndx][i].value)

targSel.options[0].selected=true
}

function go(selObj)
{
location=selObj.options[selObj.selectedIndex].value
}


Vinny

planetfall
Feb 25th, 2004, 02:38 PM
Vinny,

Thanks for your solution, it works like a charm!

The page http://www.javascriptkit.com/script/cut183.shtml should have it's contents updated with your code, because people like me are going to use the code found there, and no doubt try to put a few sets of those combos on a single page and waste so much time hunting down the solution.

Like I just did.

Thanks again!:thumbsup: