Renders a CMS object’s or a widget’s attribute value and makes it editable.
Renders a CMS object’s attribute value to a DOM element. The content can be edited by a logged-in Scrivito user.
Props
attribute (String) – the name of the attribute to be rendered.content (Obj, Widget) – the page or widget holding the attribute.tag (String) (optional) – tag name of the DOM element. Default: divOther props are rendered as HTML attributes of the resulting tag.
Props for widgetlist attributes
widgetProps (Object) (optional) – props to be passed individually to every widget contained in the widgetlist attribute. A property named widget will be ignored and cause an error to be logged. For further details, please see Passing additional props to widgets below.Example: Basic usage
Example: Specifying a CSS class name
Example: Making a date attribute editable using a placeholder
Note that the InPlaceEditingPlaceholder component is not part of the Scrivito JS SDK but of the Scrivito Example App.
Usually, a widgetlist attribute contains several widgets of different types, each based on an individual class with its set of attributes, rendered by an individual component. In general, widgets are independent of the container widget they live in (the widgetlist attribute) and vice versa. This reduces coupling, which is good.
However, sometimes there’s business logic requiring a container widget and the widgets it contains to be coupled more tightly, making it necessary to pass props from the container down to the widgets inside. If, for example, an EmployeeListWidget allowed to contain only instances of the EmployeeListItemWidget type acts as the data source of the latter widgets, it can communicate this piece of information to them via the widgetProps property. The props included in widgetProps are passed individually to the contained widgets, along with the widget prop provided by Scrivito. Here’s an example of how the “employee list” use case could be implemented: