dojo.connect with dojox.form.DropdownSelect - dojo

Question

Hi I have 3 Controls on my Razor Form. 1) combobox, 2) DropdownSelect 3) Text Input.
First I select value from Combobox and as a result i add options to DropdownSelect. After i select a value from DropdownSelect, i want to enable or disable the 3rd input box.
I am able to populate 2nd Dropdown select when i select a value in 1st Combobox. But I am not able to enable or disable the 3nd input box based on 2nd Dropdown value change.
Here is sample Code.
<input type="text" dojoType="dijit.form.ComboBox" style="margin-top: 5px;" class="left" store="regionStore" queryExpr="${0}" hasDownArrow="true"
searchAttr="text" labelAttr="name" title="Region" id="Plan_RegionName" jsId="Plan_RegionName" name="Plan.RegionName" required="true" placeholder="None" ignoreCase="true" />
<select name="Plan.PlanType" id="Plan_PlanType" title="Plan Type" dojoType="dojox.form.DropDownSelect" required="true" maxHeight="125" labelwidth="185px" style="width: 180px">
<option value="" selected="selected">-- Select One --</option>
<option value="Trial">Trial</option>
<option value="PerUser">Per User</option>
<option value="PerUnit">Per Unit</option>
<option value="Reseller">Reseller</option>
<option value="Other">Other</option>
</select>
<div dojoType="dijit.form.ValidationTextBox" style="width: 180px; margin-top: 5px;" id="Plan_Name" title="Plan Name" name="Plan.Name" required="true"
missingMessage="This value is required" promptMessage="Enter a value" value="">
<script text/type="javascript">
dojo.addOnLoad(function () {
dojo.connect(Plan_RegionName, "onChange", Plan_RegionName, function (evt) {
alert("Combo box Changed!");
});
dojo.connect(Plan_PlanType, "onChange", Plan_PlanType, function (evt) {
alert("Dropdown Changed!");
});
});
</script>
I get the alert message for Combox box change but not for Dropdown change.
Any ideas. Please advice.
thanks,
Vivek

Answer 1

Since "Plan_PlanType is a dojox.form you should be able to check if it is 'valid' as a way to enable the last textbox. So, something like:
if(dojo.byId("Plan_PlanType").validate()){
dojo.byId("Plan_Name").set("enabled", true);
}
However, you may need to wrap this in a dojo.connect function.

Answer 2

I used the onChange event of Selectbox.
Here is the example.
<select name="#name" id="#id" title="#ViewData.ModelMetadata.GetDisplayName()" onChange="enablePlanname(this.getValue())" dojoType="dijit.form.ComboBox" required="true" maxHeight="125" style="width: 180px; margin-top: 5px;">
#if (String.IsNullOrEmpty(Model))
{
<option value="" selected="selected">-- Select One --</option>
}
#foreach (CurrencyType bt in Enum.GetValues(typeof(CurrencyType)))
{
bool selected = false;
if (bt.ToString() == Model)
{
selected = true;
}
<option value="#bt.ToString()"#(selected ? " selected=\"selected\"" : "")>#bt.GetDisplayName()</option>
}
</select>
<script type="text/javascript">
function enablePlanname(value) {
var CurrentTextBox = dijit.byId('Region_Currency');
if (value == "other") {
CurrentTextBox.set("disabled", false);
}
else {
CurrentTextBox.set("disabled", true);
}
}
</script>
Thanks for all your help.