Customize the way Item Links are rendered

Modified on Thu, 24 Jul at 4:33 PM

Imagine you want to present item links not just as a link, but you want to show additional information in the cell where the item is rendered. This is especially useful for "multiItemLink" columns, as they do not support sub-columns.

Example: have a "multiItemLink" column Effects, and show together with the effect description, also its severity

TABLE OF CONTENTS

Configuration

Configuration

We can use typeProperties.itemTemplate config option to customize the way the item is rendered

    {
     "headerGroup":"Potential risks",
     "headerGroupCss": "headPotentialRisks",
     "headerCss": "headPotentialRisks",
     "header": "Effects",
     "type": "multiItemLink",
     "width": 200,
     "filterable": true,
     "level": 2,
     "id":"effects",
     "canCreate":true,
     "typeProperties": {
         "linkRole": "effect",
         "linkTypes": "risk",
         "createInCurrentDocument":true,
         "itemTemplate":"<span style=\"display: table-cell;width:100%;padding-right:4px;\">$item.fields().description().render().htmlFor().forFrame() </span><span style=\"display: table-cell;white-space: nowrap;\">[S:$item.fields().get(\"severityRating\").render().withIcon(false).htmlFor().forFrame()]"
     }
    },

For any assistance, please don’t hesitate to reach out by submitting a ticket here.