There seems to be no way to disable the control

[Danita]

It doesn't honour parent <fieldset> ng-disabled state...

<fieldset ng-disabled="true">
    <textarea ui-tinymce="opts" ng-model="myModel"></textarea>
</fieldset>

And it even won't respect own ng-disabled directive.

<textarea ui-tinymce="opts" ng-model="myModel" ng-disabled="true"></textarea>

This is important for example to prevent the user to continue writing text on the control after he has submitted the form.

[wesleycho]

7554a1d should implement disabling on the textarea element (or any other element with the directive on it).

I am not sure we can do anything about respecting the fieldset one since we have no knowledge of the parent element. I understand that that would have accessibility implications though.

Perhaps we can support a disabled option in the option object for disabling that is watched.

[steverob]

@wesleycho 0.0.9 does add ng-disabled support. But problem is initally if the textarea element has ng-disabled="true", it does not work.

But if ng-disabled is set to some expression and if it changes sometime after initialization, disabling works perfectly 👍

Is there a way to make it disabled while initializing?

[steverob]

And there's no way to get an attr's value without using $observe? :( Im getting undefined whenever I try to access attrs.disabled. Any ideas?

[wesleycho]

Perhaps I may need to update the check to use a $watch for element.prop('disabled') - I will investigate this.

[steverob]

Thanks @wesleycho. :) :)

[wesleycho]

Just noting for posterity, I have a reproduction of the issue here.

A fix should not take too long.

[steverob]

@wesleycho thanks a ton!

Would you mind letting us know when this will be released? Thanks!!

[longzheng]

Unfortunately this fix doesn't seem to work for me since when toggleDisable is ran in the $timeout, the ensureInstance() method at that point can't actually find the instance. tinymce.get(attrs.id) returns null.

[longzheng]

If you move toggleDisable(scope.$eval(attrs.ngDisabled)); to ngModel.$render however, it works consistently since at that point the instance is available.

        ngModel.$render = function() {
            ensureInstance();
            toggleDisable(scope.$eval(attrs.ngDisabled));


          var viewValue = ngModel.$viewValue ?
            $sce.getTrustedHtml(ngModel.$viewValue) : '';

          // instance.getDoc() check is a guard against null value
          // when destruction & recreation of instances happen
          if (tinyInstance &&
            tinyInstance.getDoc()
          ) {
            tinyInstance.setContent(viewValue);
            // Triggering change event due to TinyMCE not firing event &
            // becoming out of sync for change callbacks
            tinyInstance.fire('change');
          }
        };

[breity]

+1

@longzheng Thanks for this fix.

@longzheng your fix works !! thanks 👍

[deeg]

If you are still having issues with this please open a new issue with a plunker re-creating the problem so we can get a fix in.