Versions Compared

Old Version 1

changes.mady.by.user Ashraf Khamis

Saved on

compared with

New Version Current

changes.mady.by.user Julie Legendre

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: MOTION-157

...

The link field allows you to choose items from any content app, including non-JCR apps. 

...

The central property when defining a link field is appName - the name of the Magnolia app to choose the item from. The target app is responsible for providing a view that is suitable for selecting the item. When the target app is a content app, the workbench in the browser subapp is a suitable view and it is used by default. For more complex apps like the Assets app - 5 UI,  a  a choose dialog is configured in the app to browse the contents. 

Table of Contents

Link field properties

Simple link field definition

...

:

Select image
 Code Block
languagejs
form:
 tabs:
    - name: tabImage
      label: Image 
      fields:
        - name: image
          fieldType: link
          targetWorkspace: dam
          appName: assets
          label: Select image
          identifierToPathConverter:
            class: info.magnolia.dam.app.assets.field.translator.AssetCompositeIdKeyTranslator
          contentPreviewDefinition:
            contentPreviewClass: info.magnolia.dam.app.ui.field.DamFilePreviewComponent

 Localtab
titleJCR node
 Advanced Tables - Table Plus
heading0
enableHeadingAttributesfalse
enableSortingfalse
classm5-configuration-tree
enableHighlightingfalse
Node nameValue
 Mgnl n
form
 Mgnl n
tabs
 Mgnl n
tabImage
 Mgnl n
fields
 Mgnl n
image
 Mgnl n
identifierToPathConverter
 Mgnl p
class
info.magnolia.dam.app.assets.field.translator.AssetCompositeIdKeyTranslator
 Mgnl n
contentPreviewDefinition
 Mgnl p
contentPreviewClass
info.magnolia.dam.app.ui.field.DamFilePreviewComponent
 Mgnl p
appName
contacts
 Mgnl p
fieldType
link
 Mgnl p
targetWorkspace
dam
 Mgnl p
label
 Mgnl p
label
Image
 Include Page
_referencing Referencing fields shortcut info - 5 UI
_referencing Referencing fields shortcut info - 5 UI
Field-specific properties:
   
<field name>Name of field.
 appName 
required
Target app name used to create the content view to choose the item from.
All content apps provide a workbench. The workbench view is used as the link target chooser by default. However, you can also provide a choose dialog and provide custom actions. See an example in /modules/dam/apps/assets/chooseDialog.
 buttonSelectNewLabel 
optional, default is Select new... 
Button label before the target node is selected. The value is i18n-able.
 buttonSelectOtherLabel 
optional, default is Select another... 
Button label after the target node is selected. The value is i18n-able.
 contentPreviewDefinition 
optional
Render a preview of the selected content. The preview component typically displays an image thumbnail and some metadata.  
contentPreviewClass
optional
Any class that implements the 
 Javadoc resource link
rangeHigherVersion6.0
classNameinfo.magnolia.ui.form.field.component.ContentPreviewComponent
renderTypeasynchronous
 interface. Examples:
  • info.magnolia.contacts.app.field.component.ContactPreviewComponent displays a contact thumbnail and information.
  • info.magnolia.dam.app.ui.field.DamFilePreviewComponent. Displays an asset thumbnail and related information.
 fieldEditable 
optional, default is true 
Makes the text box displaying the link editable once a target has been selected.
 identifierToPathConverter 
optional
The link field returns the path of the selected node by default. You can convert the path to a UUID with a converter. 
class
optional
Any class that implements the 
 Javadoc resource link
rangeHigherVersion6.0
classNameinfo.magnolia.ui.form.field.converter.IdentifierToPathConverter
renderTypeasynchronous
 interface. Examples:
  • info.magnolia.ui.form.field.converter.BaseIdentifierToPathConverter
  • info.magnolia.dam.app.assets.field.translator.AssetCompositeIdKeyTranslator converts an asset composite ID key to a path.
targetTreeRootPath
optional, default is / 
Path in the workspace that browsing is limited to. The user can start browsing at this path but they cannot navigate to nodes above or at the same level as the target path. Use this property to restrict selecting of items to a particular folder.
 targetWorkspace 
optional, default is website 
Name of the workspace in which the target content is stored if the content app is JCR based. Examples:
appNametargetWorkspace
pageswebsite
assetsdam
contactscontacts
categoriescategory
 Common field properties:
 Include Page
_Common field properties - 5 UI
_Common field properties - 5 UI
The link field also allows you to choose items from non-JCR apps.
To understand the process when choosing an item from a content app via link field, basic knowledge of the Content app framework and  and the nature of 
 Javadoc resource link
rangeHigherVersion6.0
classNameinfo.magnolia.ui.form.field.LinkField
renderTypeasynchronous
 is necessary.
...
  • It extends a custom Vaadin field,
  • It stores a value which must be String.
  • It has a callback ( 
     Javadoc resource link
    rangeHigherVersion6.0
    classNameinfo.magnolia.ui.api.app.ChooseDialogCallback
    renderTypeasynchronous
     ). 
  • When choosing an item, the method #onItemChosen(actionName, chosenValue) is triggered on the callback. The parameter choosenValue is of type Object and is the corresponding ItemId of the item of the content app . (See see ItemIds and Items). 
Depending on the implementation of the content app, the ItemId may be a String or a more complex Object. A well-known ItemId is 
 Javadoc resource link
rangeHigherVersion6.0
classNameinfo.magnolia.ui.vaadin.integration.jcr.JcrItemId
renderTypeasynchronous
. The callback properly handles JcrItemId, and if it is another type, String.valueOf(chosenValue) is saved to the link field.
...
 field
...
.
...
When using LinkField with   JCR-agnostic target apps that use complex ItemIds that extend  Object , override the public String toString() method on the implementation of the itemId. 
If LinkField does not work for your custom content app, create a custom link field. See Custom fields for more.