Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Enable / Disable kendo ui drop down list using AngularJS ng-disabled

I am unable to get the following example working in IE9. The drop down list does not enable or disable.

Using AngularJS v1.2.22 and Kendo UI v2014.2.903

Any help would be much appreciated.

HTML:

<div kendo-drop-down-list k-data-source="names" ng-model="selected" ng-disabled="disabled">
</div> 
<label>ng-disable 
   <input type="checkbox" ng-model="disabled" /> 
</label> 
<div kendo-drop-down-list k-data-source="names" ng-model="selected" k-enable="enabled">
</div> 
<label>k-enable 
   <input type="checkbox" ng-model="enabled" /> 
</label> 
<pre>DISABLED: {{disabled}} ENABLED: {{enabled}}</pre>

JS:

$scope.names = ['Option 1', 'Option 2', 'Option 3'];
$scope.enabled = true;
like image 257
gman7911 Avatar asked Feb 11 '23 18:02

gman7911


1 Answers

Kendo's Dropdown List and Combobox does seem to have trouble binding to ng-disabled in IE9.

I have a workaround. Details are here. Complete with Plunker code.

Basically,

  1. you have to manually watch for whatever is inside the ng-disabled attribute yourself.
  2. Then call the enable() function of Kendo's Combobox yourself. Dropdown Lists should work similarly.

hth

like image 104
Gerard Setho Avatar answered Mar 05 '23 18:03

Gerard Setho