ddraper

Aikau Mini Examples - CRUD Service (update)

Blog Post created by ddraper on Sep 29, 2014

Introduction



This is one post in a series of short examples of things that can be done using the Aikau framework. The series is not intended to provide complete documentation but simply to show how to solve frequently encountered problems, implement repeating UI patterns, showcase how to use existing widgets or how to create new ones.

Real World Use Case



Sometimes you want to be able to update things. And sometimes you want to be able to update things directly from where you see them listed.

Example



This post picks up where the last one left off. I'm going to assume that you've already worked your way through the post or have at least downloaded the example JAR and taken a look at the code. We've already built a basic list of our Data Lists and provided the ability to delete Data Lists by clicking an icon associated with each entry. We now want to switch the existing 'alfresco/renderers/Property' widget for an 'alfresco/renderers/InlineEditProperty' widget to allow inline editing, this is done as follows:

var dataListTitle = widgetUtils.findObject(model.jsonModel.widgets, 'id', 'DATA_LIST_TITLE');

dataListTitle.name = 'alfresco/renderers/InlineEditProperty';

dataListTitle.config = {

  propertyToRender: 'title',

  postParam: 'prop_cm_title',

  refreshCurrentItem: true,

  requirementConfig: {

    initialValue: true

  },

  publishTopic: 'ALF_CRUD_CREATE',

  publishPayloadType: 'PROCESS',

  publishPayloadModifiers: ['processCurrentItemTokens', 'convertNodeRefToUrl'],

  publishPayloadItemMixin: false,

  publishPayload: {

    url: 'api/node/{nodeRef}/formprocessor',

    noRefresh: true,

    successMessage: 'Update success'

  }

};


Let's break down the configuration as we did before:

Publication Updates



The changes here are largely similar to those that were made in the DELETE example. One curiosity here is that we have to use the 'ALF_CRUD_CREATE' topic to perform a POST request rather than an 'ALF_CRUD_UPDATE' topic because the FormsProcessor doesn't support PUT ! The other configuration attributes of note are that we set 'publishPayloadItemMixin' to false to change the default behaviour of including the 'currentItem' object in the publication (because it would confuse the FormsProcessor) and that we set 'noRefresh' to true in the payload to override the default behaviour of publishing a reload topic to refresh the list.

InlineEditProperty



As it's name suggests this widget allows inline editing of properties. This widget (like all Aikau widgets) has been written to be extendable (the 'alfresco/renderers/InlineEditSelect' is an example of extending it). Essentially it just uses an 'alfresco/forms/Form' widget (again - an example of how Aikau aims to re-use as much code as possible) so that we leverage all the power of the forms handling widgets. The main configuration settings to note are that we set 'postParam' when the 'propertyToRender' doesn't match the expected request parameter on the REST API (if 'postParam' is omitted then the request parameter name will be the configured 'propertyToRender' value. Setting 'refreshCurrentItem' to true we ensure that any changes are applied to any other widgets dependant upon the 'currentItem' object. The 'requirementConfig' is the same as is used in Aikau form widgets and this piece of configuration is just delegated onto the underlying form control (in this case an 'alfresco/forms/controls/DojoValidationTextBox').

Example In Action



This is defined in a JavaScript controller for a WebScript mapped to the /crudServiceUpdate URL. When deployed to a Share (or any Surf based Aikau application) this can be accessed by the URL: http://localhost:8081/share/page/dp/ws/crudServiceUpdate This screenshots shows the page in action: DataListsUpdate DataListsUpdateInline DataListsUpdated   You can download the complete example here.

Outcomes