Module: alfresco/lists/views/layouts/EditableRow

alfresco/lists/views/layouts/EditableRow

This extends the standard Row widget to provide the ability to toggle between the standard mode (for reading data) and an edit mode.

It is expected that edit mode will be able to handle user input and during this mode the normal list keyboard navigation behaviour (e.g. the ability to use the cursor keys to navigate up and down the list) will be suspended until edit mode is exited. When a row has focus in read mode the user can use a combination of the CONTROL and "E" keys to enter edit mode, and in edit mode they can use the ESCAPE key to cancel.

Developers should include widgets for entering and existing edit mode (e.g. they could include a PublishAction widget in the read view to enter edit mode and a button to exit edit mode).

A typical usage might be to create a form as the edit mode. In this scenario it would be expected to set the okButtonPublishTopic to use the readModeSavePublishTopic and the cancelButtonPublishTopic to use the readModeCancelPublishTopic. An even better approach would be to go via an intermediary service so that edit mode is only exited on successful update of data to the repository.

Author:
  • Dave Draper
Copyright:
  • Copyright (C) 2005-2020 Alfresco Software Limited
License:
Source:

Extends

Mixes In

Members

_alfEditModeProcessing :Boolean

Used to indicate whether or not the widgetsForEditMode should be processed.
Type:
  • Boolean
Default Value:
  • false
Source:

cssRequirements :object[]

An array of the CSS files to use with this widget.
Type:
  • object[]
Default Value:
  • [{cssFile:"./css/EditableRow.css"}]
Source:

editModePublishTopic :string

This is the default topic that will be subscribed to in order to process requests to enter edit mode. This value can be overrridden through configuration if required.
Type:
  • string
Default Value:
  • "ALF_EDITABLE_ROW_EDIT_MODE"
Source:

readModeCancelPublishTopic :string

This is the default topic that will be subscribed to once edit mode has been entered (e.g. during the createEditModeWidgets function. This value can be overridden through configuration if required.
Type:
  • string
Default Value:
  • "ALF_EDITABLE_ROW_READ_MODE_CANCEL"
Source:

readModeSavePublishTopic :string

This is the default topic that will be subscribed to once edit mode has been entered (e.g. during the createEditModeWidgets function. This value can be overridden through configuration if required.
Type:
  • string
Default Value:
  • "ALF_EDITABLE_ROW_READ_MODE_SAVE"
Source:

widgetsForEditMode :array

The JSON model describing the widgets to use to create the edit mode. This needs to be configured in order to edit mode to work at all.
Type:
  • array
Default Value:
  • null
Source:

Methods

allWidgetsProcessed(widgets)

This is an extension point for handling the completion of calls to processWidgets. After processing the initial (read display) widgets the _alfEditModeProcessing attribute is set to true to indicate that the next iteration will represent the completion of the creation of the edit display widgets.
Parameters:
Name Type Description
widgets Array An array of all the widgets that have been processed
Source:

cleanUpMode(widgets, node)

Cleans up the mode by destroying the widgets, emptying the node and then recreating them.
Parameters:
Name Type Description
widgets array The widgets to destroy
node object The DOM node to empty.
Source:

createEditModeWidgets()

Used to create the DOM elements to display the edit mode. This is called the first time that the onEditMode is executed.
Source:

createReadModeWidgets()

Creates the widgets for the read display.
Source:

onEditClick()

Delegate edit clicks (issued from the KeyboardNavigationSuppressionMixin) to the onEditMode function.
Source:

onSave(payload)

Handles save events. Just because edit mode is exited does not mean that any data needs to be updated (e.g. the user could have requested to cancel editing). However when a save is required this function will be used to update the currentItem with the updated data.
Parameters:
Name Type Description
payload object The payload containing the updated data for the currentItem
Source:

postCreate()

Source:

<inner> onEditMode(payload)

Handles requests to enter edit mode for the row.
Parameters:
Name Type Description
payload object The payload on the request to enter edit mode.
Source:

<inner> onReadMode(payload)

Handles requests to enter edit mode for the row.
Parameters:
Name Type Description
payload object The payload on the request to enter read mode.
Source: