Displaying hidden text-box on particular option won't work when it is the only option present

Question

I have the following javascript to display a hidden textbox onchange when a certain option is selected. It works fine when multiple options are present. But when the only option is the one that makes the text-box appear, it won't work. I tried onload too for no results.

       function showOther(fieldObj, otherFieldID)
            {

                var fieldValue = fieldObj.options[fieldObj.selectedIndex].value;
                var otherFieldObj = document.getElementById(otherFieldID);

                otherFieldObj.style.visibility = (fieldValue=='other') ? '' : 'hidden';

                return;
            }`

Here's the working fiddle http://jsfiddle.net/8bm9R/2/ Look at the first select field

Answer 1

If it has only one option in the list then onchange event doesn't fire . Use onclick instead:

<select name="task" onclick="showOther(this, 'new');">

(JSFiddle please: http://jsfiddle.net/8bm9R/7/ ).
To prevent this behaviour and be able to use onchange may be it will be good to add some default option to the list , something like "Choose a Job"..

Answer 2

The onchange Event trigges only, if something changed. You could do something like this: Please choose...

or maybe:

<select name="jobs" onmouseup="showOther(this,'new');">