Onchange Event 1

[mbaddar]

Hi,

I'm trying to write an onchange event for a select, dropdown box ("SelState&quot. When a particular state is chosen (there are six diff states in dropdown), I want to populate a second select, dropdown box ("Products&quot with different values.

I'm not sure how to populate the 2nd dropdown based on what is selected in the first. The code below is an example, though, of what I'm trying to do.

function FillSubject()

{

if (SelState.value = "MA&quot
<select id=&quot;Products&quot; name=&quot;Products&quot;>
<option value=Paper>Paper
<option value=Cartridges>Cartridges
if (SelState.value = &quot;NY&quot
<select id=&quot;Products&quot; name=&quot;Products&quot;>
<option value=Paper>Paper
<option value=Printers>Printers

</script>

<select id=&quot;Products&quot; onchange=&quot;FillSubject()&quot; name=&quot;Products&quot;>

I repeat the select name and id tags for the second dropdown (&quot;Products&quot each time I refer to it. I know that's not right but I'm not sure how else to approach (don't have much experience with javascript).

Thanks for any help.
MBaddar

 

[xutopia]

there are no easy way to do this so you will need to write a lot of code to get the rules of your interface up and going. However if you already know this and all you need is to know how to technically add an option in a select here is how I would do it :

<form>
<select id=&quot;toto&quot;></select>
</form>

<script>

// first keep things in a two dimensional array will be easier for you
var myOptions = [new Option(&quot;text&quot;,&quot;value&quot,
new Option(&quot;text that appears&quot;, &quot;value sent to server&quot,
new Option(&quot;add to taste&quot;,&quot;kihi&quot]

function fillSelectBox(idOfSelect, arrayToFeed)
{
var mySelect = document.getElementById(idOfSelect)
mySelect.options.length = 0; // empty it first as we never know

// now let's crunch them options in there!
for (var i = 0; i < myOptions.length; i++)
{
mySelect.options = myOptions;
}
}

// and here is how you would call the function
fillSelectBox(&quot;toto&quot;, myOptions)

</script>

Of course since you will be calling this from another select make the other select have the onchange attribute filled with the function call.

I hope this gets you started on the right track! Good luck! Gary

http://www.xutopia.com

Haran

 

[mbaddar]

Hi xutopia,

Thank you very much for that detailed example. That will definitely get me on the right track.

Best Regards,
MBaddar

 

[xutopia]

sorry about that replace the line :

mySelect.options = myOptions;

with

mySelect.options = myOptions;

I hope this helps. Gary

http://www.xutopia.com

Haran