Page 1 of 1

onchange handler not working as desired

Posted: Wed Feb 17, 2010 6:45 pm
by Randwulf
Hi all,

So I have a form with three drop down boxes. When I select a value in the first drop down box, the options for the second dropdown box are retrieved from a PHP script via AJAX. Likewise, when I select a value in the second dropdown box, the options for the third are also retrieved via AJAX. This is done with an onchange handler. You can see how this works at the following URL: http://sandbox.metaneva.org/search/index.php

That works perfectly. I run into problems later however when I try to change the value in one of the dropdown boxes with Javascript.

See, I have a text field that a user can enter a string into (this feature is not in the sandbox at that URL yet), and that string will then be used to populate the dropdown boxes. For example, if the user enters "subject-genus-dog", then "subject" should become selected in the first dropdown box, "genus" should be selected in the second dropdown box, and "dog" should be selected in the third.

The problem is, the onchange handler doesn't seem to trigger when the value of the first dropdown box is changed to "subject", and thus the second dropdown box does not get populated with options via AJAX, and so "genus" cannot be selected because the only option in the second dropdown box is the default "select a value in the first box".

Why doesn't the onchange handler trigger when a dropdown box is changed with the following code?

Code: Select all

document.getElementById(destination).value = reloadValuesSubArr[1];
Is this a bug in Javascript? Or am I doing it wrong? Keep in mind that the value of the first dropbox changes without issue, but the onchange handler does not trigger.

Any help? I'll super appreciate it :p

Thanks