Search code examples
angularjsng-optionsangularjs-ng-disabled

AngularJS Enable / Disable Dropdown based on the variable


I have a Dropdown on the CreateTask.cshtml page as below.

<select class="form-control input-sm" id="analysisType" name="analysisType" ng-model="vm.analysisType" ng-options="analysistype.typeID as analysistype.typeName for analysistype in vm.analysisTypes" placeholder="Choose analysis type " required><option value=""></option></select>

Here I am setting a variable value conditionally to true or false on CreateTask.JS file.

vm.isNewTask =true;

If NewTask, the Dropdown should be enabled. If not NewTask, this Dropdown will be defaulted to a value and should be disabled. I tried

Thanks


Solution

  • You'll want to use the ngDisabled directive.

    <select class="form-control input-sm" id="analysisType" name="analysisType"
            ng-model="vm.analysisType"
            ng-options="analysistype.typeID as analysistype.typeName for analysistype in vm.analysisTypes" 
            ng-disabled="!vm.isNewTask" placeholder="Choose analysis type "
            required>
       <option value=""></option>
    </select>