SuiteCRM Developer Insights - Adding Grouped Fields

SalesAgility is excited to share another Developer Insights episode with you. This time, Clemente Raposo, Lead Developer of SuiteCRM, shares a step-by-step guide on how to inject Grouped Fields in the Record View of SuiteCRM 8.

Grouped Fields allow you to show multiple fields grouped together as if they were one field. That way, multiple items of data are shown in an either inline compact format or grouped vertical format, enhancing the user experience of your SuiteCRM 8 instance.

It is worth noting that SuiteCRM is open source software, which means that you are free to download, install, use it for your benefit, as well as modify the software to better suit your businesses needs. By utilising SuiteCRM, your business is being provided with all the benefits of optimised customer relationship management without ever-escalating user licensing costs, restricting data limits, or vendor lock-in.

In today’s developer tutorial, we make use of the SuiteCRM 8 extension framework to configure the Record View to show multiple fields—such as the home, mobile, and office phone—grouped together in one location. In doing so, we keep the code abstracted from other extensions and maintain upgrade safety.

Watch the video for a complete walkthrough, and don’t forget to check below for the code example to help you get started! Also, to discuss this topic in depth and get your questions answered, join the discussion in our forum!

You can find the code sample from the video below:

Copy to Clipboard

<?php

namespace App\Extension\defaultExt\modules\Contacts\ViewDefinitions\Mappers;

use App\FieldDefinitions\Entity\FieldDefinition;
use App\ViewDefinitions\Entity\ViewDefinition;
use App\ViewDefinitions\LegacyHandler\ViewDefinitionMapperInterface;

class AddPhonesField implements ViewDefinitionMapperInterface
{

/**
     * AddPhonesField constructor.
     */
    public function __construct()
    {
    }

/**
     * @inheritDoc
     */
    public function getKey(): string
    {
        return 'contacts-record-view-add-phones';
    }

/**
     * @inheritDoc
     */
    public function getModule(): string
    {
        return 'contacts';
    }

/**
     * @inheritDoc
     */
    public function map(ViewDefinition $definition, FieldDefinition $fieldDefinition): void
    {
        // 1. Get panel metadata definition
        $recordView = $definition->getRecordView() ?? [];
        $panels = $recordView['panels'] ?? [];
        $main = $panels[0] ?? [];
        $rows = $main['rows'] ?? [];
        $firstRow = $rows[0] ?? [];
        $cols = $firstRow['cols'] ?? [];

$vardefs = $fieldDefinition->getVardef();

// 2. Define group field

$phonesDefinition = [
            'type' => 'grouped-field',
            'name' => 'phone',
            'display' => 'inline',
            'groupFields' => [
                'phone_home' => $vardefs['phone_home'] ?? [],
                'phone_mobile' => $vardefs['phone_mobile'] ?? [],
                'phone_work' => $vardefs['phone_work'] ?? [],
            ],
            'layout' => [
                'phone_home',
                'phone_mobile',
                'phone_work',
            ],
            'showLabel' => [
                'edit' => ['*'],
                'detail' => ['*'],
                'filter' => ['*']
            ]
        ];

// 3. Add field to first row

$cols[] = [
            'name' => 'phones',
            'label' => 'LBL_PHONE',
            'type' => 'grouped-field',
            'fieldDefinition' => $phonesDefinition
        ];

// Just for demo purposes. Not recommended. Remove the 2nd row
        array_splice($rows, 1, 1);

// 5. Re-set panel metadata definition
        $firstRow['cols'] = $cols;
        $rows[0] = $firstRow;
        $main['rows'] = $rows;
        $panels[0] = $main;
        $recordView['panels'] = $panels;
        $definition->setRecordView($recordView);
    }

}

extensions/defaultExt/modules/Contacts/ViewDefinitions/Mappers/AddPhonesField.php

The above can be used as an example of adding Grouped Fields to the Record View in your instance of SuiteCRM 8.

If you are looking for more development insights, the Development Team here at SalesAgility have created instructor-led Masterclasses. Designed for developers, covering both SuiteCRM 8.x and SuiteCRM 7.x, head over to the Masterclasses to find out more.

About SuiteCRM

SuiteCRM is the world’s #1 open source CRM with over 1 million downloads and counting. Our feature-rich enterprise-ready CRM solution enables your sales teams to sell, market & service smarter by providing all the benefits of optimised customer relationship management, without any user licensing costs, data limits, or vendor lock-in.

You can download and host SuiteCRM on your own servers, in the public cloud / private cloud or try our SAAS offering SuiteCRM Hosted. It is the ultimate freedom, allowing you to stay in full control over your business data. Try SuiteCRM for free here.

Help support the SuiteCRM project by becoming a sponsor today!

SuiteCRM Developer Insights – Adding Grouped Fields

About SuiteCRM

Share This Story, Choose Your Platform!