+ Start a Discussion
Pasan   EeriyagamaPasan Eeriyagama 

How to make lightning:inputRichText Readonly?

How do you make lightning:inputRichText readonly, there is a disabled attribute. It seems not working yet. Is there a workaround to show it as a readonly field on page (by wrapping with a div tags may be).

<lightning:inputRichText value="{!v.richTextfield}" disabled="true" disabledCategories="FORMAT_FONT,FORMAT_TEXT,FORMAT_BODY,ALIGN_TEXT,REMOVE_FORMATTING"/>

Rahul KumarRahul Kumar (Salesforce Developers) 
Hi, PasanEeriyagama,

May I suggest you Please refer the below link for reference. I hope it will be helpful.

Please mark it as best answer if the information is informative.so that question is removed from an unanswered question and appear as a proper solution.

Rahul Kumar
Hi PasanEeriyagama,

Since Lightning Tags are in beta version , might be one reason that its not working . Alternatively, I have done with some css .
Below is a code for the same. Hope it helps you.

Aura Component Code :
<aura:component controller="searchAccountController">
   <aura:attribute name="abc" type="string" />
   <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
   <div id="texteditor">
    <div class="slds-form-element">
         <label class="slds-form-element__label" for="textareaSample2">Rich Text Editor</label>
         <div class="slds-form-element__control" id="editor">
             <lightning:inputRichText value="{!v.abc}" />
Aura Controller Code :
doInit: function (c, e, h) {
      c.set("v.abc",'This is the testing of rich text editor for word wrap content. Hope it helps you !!');
Aura App Code :
<aura:application extends="force:slds">
Style Sheet Code :
.THIS #editor {
pointer-events: none;

Screenshot :
User-added image

Pasan   EeriyagamaPasan Eeriyagama
It's because disabled property is not working as expected. It's not resulting a readonly view for the user yet. Hope it'll be fixed in one of next releases.
@Pasan Eeriyagama did you find a solution to this issue. I am trying to make the lightning:inputRichText readonly and it does not seem to work.
Pasan   EeriyagamaPasan Eeriyagama
Hi @Malini Gali7, It wasn't at that time. I would like you to suggest using 2 divs, hide/show for edit/view modes as the last resort.
Thanks Pasan