Text Editor widget - using enabled

Question

I have a 'Text Editor' widget input field that I would like to display as a read only field within a particular form. I put in a formula for the enabled property in the Display section. Everything works fine, except that the text in this field is dimmed when viewing. I was hoping to get the same behavior (where there is rich text displayed with bolding, italics, links, etc.) but with the text in this widget not dimmed and wondering the best way to do this.

Pavel Shkleinik Pavel Shkleinik · Accepted Answer · 2017-10-24T17:21:20

There are two major approaches to handle such case:

Implement two separate pages for viewing and editing record. It will provide users with better experience, but will add some work for developers. With such approach you can use Labels instead of simple inputs and Html Widget instead of Text Editor
Play with bindings for the enabled and visible widgets property. This approach can also introduce some complexity for your app and add some hurdles for end users. If you really want to go this way here is CSS snippet that should make Text Editor look better in disabled state:

.app-MyPage-MyTextEditor-Toolbar {
  display: none;
}

.app-MyPage-MyTextEditor-Body {
  top: 0;
}

.app-MyPage-MyTextEditor.disabled .app-TextEditor-Input {
  opacity: 1;
}

.app-MyPage-MyTextEditor .app-TextEditor-Toolbar {
  display: none;
}

.app-MyPage-MyTextEditor .app-TextEditor-Body {
  top: 0;
}

Text Editor widget - using enabled

1 Answers