display result from 2 drop downs

[neonpie]

Hi all,

I have 2 dropdowns with values from 1-10 in each of them (these are the sizes of valves for some pipes). what i want is for the user to choose a value from each dropdown and for a message and image to be displayed to say which is the correct valve they need.

however not all combination will have a valve, so a default message can just say there is nothing availbe for that selection (or something along those lines.

once they have chosen the correct valve they can complete the rest of the form which will then send an email - i can do this part ok.

thanks in advance

[Trace]

JavaScript

<script type="text/javascript">
function displayResults(){
firstValue = document.getElementById('first').options[document.getElementById('first').selectedIndex].value
secondValue = document.getElementById('second').options[document.getElementById('second').selectedIndex].value

if(firstValue == 1 && secondValue == 1){
theMessage = '<font color=green>You selected this size: ' + firstValue + 'x' + secondValue + '</font>';
}else if(firstValue == 1 && secondValue == 2){
theMessage = '<font color=green>You selected this size: ' + firstValue + 'x' + secondValue + '</font>';
}else{
theMessage = '<font color=red>There are no matching sizes!</font>'
}
document.getElementById('results').innerHTML = theMessage;
}
</script>

HTML

<select id="first" onchange="displayResults()">
<option>Select a size</option>
<option value="1">1</option>
<option value="2">2</option>
</select>

<select id="second" onchange="displayResults()">
<option>Select a size</option>
<option value="1">1</option>
<option value="2">2</option>
</select>

<div id="results"></div>

Typed up real quick. Can be improved upon greatly.

Right now the script will only consider 1x1 and 1x2 as valid. Any other combination will show the default message.

[neonpie]

Thanks Trace, that was exactly what i was looking for.

Many Thanks