Disable dropdownlist based on the selected value of another

Question

Hello,

This may be a stupid question, but I'm still learning so do forgive me if the answer is obvious :)

I have a test page with the following on:

<select name="ddlRoles" ID="ddlRoles" OnChange="DisEnableDDL();">
<option value="-1">Fresh Milk</option>
<option value="2">Old Cheese</option>
<option value="3">Hot Bread</option>
</select>
<select name="ddlCust" ID="ddlCust">
<option value="-1">rawr</option>
<option value="2">root</option>
<option value="3">honk</option>
</select>

If the user selects anything with a value that's not 3 from ddl Roles, it should disable ddlCust. Here's my JS function:

function DisEnableDDL()
{
var ddlR = document.getElementById("ddlRoles")
var ddlC = document.getElementById("ddlCust")
if(ddlR.options[ddlR.selectedIndex].value = "3")
 {
    ddlC.disabled = false;
 }
else
 {
    ddlC.selectedIndex = 0;
    ddlC.disabled = true;    
 }
}

Doesn't work. What am I missing? have I failed to set my variables properly? Does this just change the variables ddlR and ddlC without changing the elements on the page itself or something? Following it through in Firebug, it seems to fall into the correct statements, but ddlCust never gets disabled.

Any help would be most appreciated!

Answer 1

== instead of = in your if:

if(ddlR.options[ddlR.selectedIndex].value == "3")

= is for assignment, whereas == is for comparison, in most C-like syntaxes.

Answer 2

You're not comparing properly, you need to use '==':

if(ddlR.options[ddlR.selectedIndex].value == "3")