Q:

Clear other text and select field values on main select change

I have a dropdown to change the main category on a form, this subsequently shows and hides the relevant dropdowns to enter data regarding that category.
When I then change the select and those dropdowns are hidden they retain their values which subsequently get written to the database.
I need some javascript to just reset all fields to null values.
Currently I'm attempting this html:
<select name="c_type" id="c_type" style="width:505px;" onchange="optionCheck();">
<option selected>--- Select a Product Type ---</option><option value="dimmer" >Dimmer</option><option value="LED_downlight" >LED Downlight</option><option value="LED_lamp" >LED Lamp</option><option value="socket" >Socket</option></select>

<div id="d_wattage" class = "typespec_option"><b>Wattage: &nbsp;&nbsp;</b><br><input name ="d_wattage" id="wattage_input"  value="0" onclick="this.value='';" ></input></div>

<div id="d_dimmable"><select name ="d_dimmable" style="width:400px" id="dimmable_input";><option value="" >--- Select Dimmable ---</option><option value="No" >No</option><option value="Yes" >Yes</option></select></div>

Alongside the clearly incorrect script:
function optionCheck()
{
document.getElementByID("wattage_input").value = '';
document.getElementByID("dimmable_input").value = '';
}

Answers on a postcard. Or for ease, if you could have a look at this fiddle -> http://jsfiddle.net/8Hy6S/

A:

It's getElementById, not getElementByID:
function optionCheck() {
    document.getElementById("wattage_input").value = '';
    document.getElementById("dimmable_input").value = '';
}

jsFiddle example
Also, in your fiddle example you were loading the code in the window load event instead of simply the head of the document, which was adding a scoping problem.

